<!DOCTYPE html>

<html lang="en">
<head><meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>Untitled1</title><script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.10/require.min.js"></script>
<style type="text/css">
    pre { line-height: 125%; }
td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; }
td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; }
.highlight .hll { background-color: var(--jp-cell-editor-active-background) }
.highlight { background: var(--jp-cell-editor-background); color: var(--jp-mirror-editor-variable-color) }
.highlight .c { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment */
.highlight .err { color: var(--jp-mirror-editor-error-color) } /* Error */
.highlight .k { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword */
.highlight .o { color: var(--jp-mirror-editor-operator-color); font-weight: bold } /* Operator */
.highlight .p { color: var(--jp-mirror-editor-punctuation-color) } /* Punctuation */
.highlight .ch { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment.Hashbang */
.highlight .cm { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment.Multiline */
.highlight .cp { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment.Preproc */
.highlight .cpf { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment.PreprocFile */
.highlight .c1 { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment.Single */
.highlight .cs { color: var(--jp-mirror-editor-comment-color); font-style: italic } /* Comment.Special */
.highlight .kc { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword.Constant */
.highlight .kd { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword.Declaration */
.highlight .kn { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword.Namespace */
.highlight .kp { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword.Pseudo */
.highlight .kr { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword.Reserved */
.highlight .kt { color: var(--jp-mirror-editor-keyword-color); font-weight: bold } /* Keyword.Type */
.highlight .m { color: var(--jp-mirror-editor-number-color) } /* Literal.Number */
.highlight .s { color: var(--jp-mirror-editor-string-color) } /* Literal.String */
.highlight .ow { color: var(--jp-mirror-editor-operator-color); font-weight: bold } /* Operator.Word */
.highlight .pm { color: var(--jp-mirror-editor-punctuation-color) } /* Punctuation.Marker */
.highlight .w { color: var(--jp-mirror-editor-variable-color) } /* Text.Whitespace */
.highlight .mb { color: var(--jp-mirror-editor-number-color) } /* Literal.Number.Bin */
.highlight .mf { color: var(--jp-mirror-editor-number-color) } /* Literal.Number.Float */
.highlight .mh { color: var(--jp-mirror-editor-number-color) } /* Literal.Number.Hex */
.highlight .mi { color: var(--jp-mirror-editor-number-color) } /* Literal.Number.Integer */
.highlight .mo { color: var(--jp-mirror-editor-number-color) } /* Literal.Number.Oct */
.highlight .sa { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Affix */
.highlight .sb { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Backtick */
.highlight .sc { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Char */
.highlight .dl { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Delimiter */
.highlight .sd { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Doc */
.highlight .s2 { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Double */
.highlight .se { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Escape */
.highlight .sh { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Heredoc */
.highlight .si { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Interpol */
.highlight .sx { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Other */
.highlight .sr { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Regex */
.highlight .s1 { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Single */
.highlight .ss { color: var(--jp-mirror-editor-string-color) } /* Literal.String.Symbol */
.highlight .il { color: var(--jp-mirror-editor-number-color) } /* Literal.Number.Integer.Long */
  </style>
<style type="text/css">
/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*
 * Mozilla scrollbar styling
 */

/* use standard opaque scrollbars for most nodes */
[data-jp-theme-scrollbars='true'] {
  scrollbar-color: rgb(var(--jp-scrollbar-thumb-color))
    var(--jp-scrollbar-background-color);
}

/* for code nodes, use a transparent style of scrollbar. These selectors
 * will match lower in the tree, and so will override the above */
[data-jp-theme-scrollbars='true'] .CodeMirror-hscrollbar,
[data-jp-theme-scrollbars='true'] .CodeMirror-vscrollbar {
  scrollbar-color: rgba(var(--jp-scrollbar-thumb-color), 0.5) transparent;
}

/* tiny scrollbar */

.jp-scrollbar-tiny {
  scrollbar-color: rgba(var(--jp-scrollbar-thumb-color), 0.5) transparent;
  scrollbar-width: thin;
}

/* tiny scrollbar */

.jp-scrollbar-tiny::-webkit-scrollbar,
.jp-scrollbar-tiny::-webkit-scrollbar-corner {
  background-color: transparent;
  height: 4px;
  width: 4px;
}

.jp-scrollbar-tiny::-webkit-scrollbar-thumb {
  background: rgba(var(--jp-scrollbar-thumb-color), 0.5);
}

.jp-scrollbar-tiny::-webkit-scrollbar-track:horizontal {
  border-left: 0 solid transparent;
  border-right: 0 solid transparent;
}

.jp-scrollbar-tiny::-webkit-scrollbar-track:vertical {
  border-top: 0 solid transparent;
  border-bottom: 0 solid transparent;
}

/*
 * Lumino
 */

.lm-ScrollBar[data-orientation='horizontal'] {
  min-height: 16px;
  max-height: 16px;
  min-width: 45px;
  border-top: 1px solid #a0a0a0;
}

.lm-ScrollBar[data-orientation='vertical'] {
  min-width: 16px;
  max-width: 16px;
  min-height: 45px;
  border-left: 1px solid #a0a0a0;
}

.lm-ScrollBar-button {
  background-color: #f0f0f0;
  background-position: center center;
  min-height: 15px;
  max-height: 15px;
  min-width: 15px;
  max-width: 15px;
}

.lm-ScrollBar-button:hover {
  background-color: #dadada;
}

.lm-ScrollBar-button.lm-mod-active {
  background-color: #cdcdcd;
}

.lm-ScrollBar-track {
  background: #f0f0f0;
}

.lm-ScrollBar-thumb {
  background: #cdcdcd;
}

.lm-ScrollBar-thumb:hover {
  background: #bababa;
}

.lm-ScrollBar-thumb.lm-mod-active {
  background: #a0a0a0;
}

.lm-ScrollBar[data-orientation='horizontal'] .lm-ScrollBar-thumb {
  height: 100%;
  min-width: 15px;
  border-left: 1px solid #a0a0a0;
  border-right: 1px solid #a0a0a0;
}

.lm-ScrollBar[data-orientation='vertical'] .lm-ScrollBar-thumb {
  width: 100%;
  min-height: 15px;
  border-top: 1px solid #a0a0a0;
  border-bottom: 1px solid #a0a0a0;
}

.lm-ScrollBar[data-orientation='horizontal']
  .lm-ScrollBar-button[data-action='decrement'] {
  background-image: var(--jp-icon-caret-left);
  background-size: 17px;
}

.lm-ScrollBar[data-orientation='horizontal']
  .lm-ScrollBar-button[data-action='increment'] {
  background-image: var(--jp-icon-caret-right);
  background-size: 17px;
}

.lm-ScrollBar[data-orientation='vertical']
  .lm-ScrollBar-button[data-action='decrement'] {
  background-image: var(--jp-icon-caret-up);
  background-size: 17px;
}

.lm-ScrollBar[data-orientation='vertical']
  .lm-ScrollBar-button[data-action='increment'] {
  background-image: var(--jp-icon-caret-down);
  background-size: 17px;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-Widget {
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}

.lm-Widget.lm-mod-hidden {
  display: none !important;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

.lm-AccordionPanel[data-orientation='horizontal'] > .lm-AccordionPanel-title {
  /* Title is rotated for horizontal accordion panel using CSS */
  display: block;
  transform-origin: top left;
  transform: rotate(-90deg) translate(-100%);
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-CommandPalette {
  display: flex;
  flex-direction: column;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.lm-CommandPalette-search {
  flex: 0 0 auto;
}

.lm-CommandPalette-content {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  min-height: 0;
  overflow: auto;
  list-style-type: none;
}

.lm-CommandPalette-header {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.lm-CommandPalette-item {
  display: flex;
  flex-direction: row;
}

.lm-CommandPalette-itemIcon {
  flex: 0 0 auto;
}

.lm-CommandPalette-itemContent {
  flex: 1 1 auto;
  overflow: hidden;
}

.lm-CommandPalette-itemShortcut {
  flex: 0 0 auto;
}

.lm-CommandPalette-itemLabel {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.lm-close-icon {
  border: 1px solid transparent;
  background-color: transparent;
  position: absolute;
  z-index: 1;
  right: 3%;
  top: 0;
  bottom: 0;
  margin: auto;
  padding: 7px 0;
  display: none;
  vertical-align: middle;
  outline: 0;
  cursor: pointer;
}
.lm-close-icon:after {
  content: 'X';
  display: block;
  width: 15px;
  height: 15px;
  text-align: center;
  color: #000;
  font-weight: normal;
  font-size: 12px;
  cursor: pointer;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-DockPanel {
  z-index: 0;
}

.lm-DockPanel-widget {
  z-index: 0;
}

.lm-DockPanel-tabBar {
  z-index: 1;
}

.lm-DockPanel-handle {
  z-index: 2;
}

.lm-DockPanel-handle.lm-mod-hidden {
  display: none !important;
}

.lm-DockPanel-handle:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
}

.lm-DockPanel-handle[data-orientation='horizontal'] {
  cursor: ew-resize;
}

.lm-DockPanel-handle[data-orientation='vertical'] {
  cursor: ns-resize;
}

.lm-DockPanel-handle[data-orientation='horizontal']:after {
  left: 50%;
  min-width: 8px;
  transform: translateX(-50%);
}

.lm-DockPanel-handle[data-orientation='vertical']:after {
  top: 50%;
  min-height: 8px;
  transform: translateY(-50%);
}

.lm-DockPanel-overlay {
  z-index: 3;
  box-sizing: border-box;
  pointer-events: none;
}

.lm-DockPanel-overlay.lm-mod-hidden {
  display: none !important;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-Menu {
  z-index: 10000;
  position: absolute;
  white-space: nowrap;
  overflow-x: hidden;
  overflow-y: auto;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.lm-Menu-content {
  margin: 0;
  padding: 0;
  display: table;
  list-style-type: none;
}

.lm-Menu-item {
  display: table-row;
}

.lm-Menu-item.lm-mod-hidden,
.lm-Menu-item.lm-mod-collapsed {
  display: none !important;
}

.lm-Menu-itemIcon,
.lm-Menu-itemSubmenuIcon {
  display: table-cell;
  text-align: center;
}

.lm-Menu-itemLabel {
  display: table-cell;
  text-align: left;
}

.lm-Menu-itemShortcut {
  display: table-cell;
  text-align: right;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-MenuBar {
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.lm-MenuBar-content {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: row;
  list-style-type: none;
}

.lm-MenuBar-item {
  box-sizing: border-box;
}

.lm-MenuBar-itemIcon,
.lm-MenuBar-itemLabel {
  display: inline-block;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-ScrollBar {
  display: flex;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.lm-ScrollBar[data-orientation='horizontal'] {
  flex-direction: row;
}

.lm-ScrollBar[data-orientation='vertical'] {
  flex-direction: column;
}

.lm-ScrollBar-button {
  box-sizing: border-box;
  flex: 0 0 auto;
}

.lm-ScrollBar-track {
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  flex: 1 1 auto;
}

.lm-ScrollBar-thumb {
  box-sizing: border-box;
  position: absolute;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-SplitPanel-child {
  z-index: 0;
}

.lm-SplitPanel-handle {
  z-index: 1;
}

.lm-SplitPanel-handle.lm-mod-hidden {
  display: none !important;
}

.lm-SplitPanel-handle:after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
}

.lm-SplitPanel[data-orientation='horizontal'] > .lm-SplitPanel-handle {
  cursor: ew-resize;
}

.lm-SplitPanel[data-orientation='vertical'] > .lm-SplitPanel-handle {
  cursor: ns-resize;
}

.lm-SplitPanel[data-orientation='horizontal'] > .lm-SplitPanel-handle:after {
  left: 50%;
  min-width: 8px;
  transform: translateX(-50%);
}

.lm-SplitPanel[data-orientation='vertical'] > .lm-SplitPanel-handle:after {
  top: 50%;
  min-height: 8px;
  transform: translateY(-50%);
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-TabBar {
  display: flex;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.lm-TabBar[data-orientation='horizontal'] {
  flex-direction: row;
  align-items: flex-end;
}

.lm-TabBar[data-orientation='vertical'] {
  flex-direction: column;
  align-items: flex-end;
}

.lm-TabBar-content {
  margin: 0;
  padding: 0;
  display: flex;
  flex: 1 1 auto;
  list-style-type: none;
}

.lm-TabBar[data-orientation='horizontal'] > .lm-TabBar-content {
  flex-direction: row;
}

.lm-TabBar[data-orientation='vertical'] > .lm-TabBar-content {
  flex-direction: column;
}

.lm-TabBar-tab {
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  overflow: hidden;
  touch-action: none; /* Disable native Drag/Drop */
}

.lm-TabBar-tabIcon,
.lm-TabBar-tabCloseIcon {
  flex: 0 0 auto;
}

.lm-TabBar-tabLabel {
  flex: 1 1 auto;
  overflow: hidden;
  white-space: nowrap;
}

.lm-TabBar-tabInput {
  user-select: all;
  width: 100%;
  box-sizing: border-box;
}

.lm-TabBar-tab.lm-mod-hidden {
  display: none !important;
}

.lm-TabBar-addButton.lm-mod-hidden {
  display: none !important;
}

.lm-TabBar.lm-mod-dragging .lm-TabBar-tab {
  position: relative;
}

.lm-TabBar.lm-mod-dragging[data-orientation='horizontal'] .lm-TabBar-tab {
  left: 0;
  transition: left 150ms ease;
}

.lm-TabBar.lm-mod-dragging[data-orientation='vertical'] .lm-TabBar-tab {
  top: 0;
  transition: top 150ms ease;
}

.lm-TabBar.lm-mod-dragging .lm-TabBar-tab.lm-mod-dragging {
  transition: none;
}

.lm-TabBar-tabLabel .lm-TabBar-tabInput {
  user-select: all;
  width: 100%;
  box-sizing: border-box;
  background: inherit;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-TabPanel-tabBar {
  z-index: 1;
}

.lm-TabPanel-stackedPanel {
  z-index: 0;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-Collapse {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.jp-Collapse-header {
  padding: 1px 12px;
  background-color: var(--jp-layout-color1);
  border-bottom: solid var(--jp-border-width) var(--jp-border-color2);
  color: var(--jp-ui-font-color1);
  cursor: pointer;
  display: flex;
  align-items: center;
  font-size: var(--jp-ui-font-size0);
  font-weight: 600;
  text-transform: uppercase;
  user-select: none;
}

.jp-Collapser-icon {
  height: 16px;
}

.jp-Collapse-header-collapsed .jp-Collapser-icon {
  transform: rotate(-90deg);
  margin: auto 0;
}

.jp-Collapser-title {
  line-height: 25px;
}

.jp-Collapse-contents {
  padding: 0 12px;
  background-color: var(--jp-layout-color1);
  color: var(--jp-ui-font-color1);
  overflow: auto;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/* This file was auto-generated by ensureUiComponents() in @jupyterlab/buildutils */

/**
 * (DEPRECATED) Support for consuming icons as CSS background images
 */

/* Icons urls */

:root {
  --jp-icon-add-above: url();
  --jp-icon-add-below: url();
  --jp-icon-add: url();
  --jp-icon-bell: url();
  --jp-icon-bug-dot: url();
  --jp-icon-bug: url();
  --jp-icon-build: url();
  --jp-icon-caret-down-empty-thin: url();
  --jp-icon-caret-down-empty: url();
  --jp-icon-caret-down: url();
  --jp-icon-caret-left: url();
  --jp-icon-caret-right: url();
  --jp-icon-caret-up-empty-thin: url();
  --jp-icon-caret-up: url();
  --jp-icon-case-sensitive: url();
  --jp-icon-check: url();
  --jp-icon-circle-empty: url();
  --jp-icon-circle: url();
  --jp-icon-clear: url();
  --jp-icon-close: url();
  --jp-icon-code-check: url();
  --jp-icon-code: url();
  --jp-icon-collapse-all: url();
  --jp-icon-console: url();
  --jp-icon-copy: url();
  --jp-icon-copyright: url();
  --jp-icon-cut: url();
  --jp-icon-delete: url();
  --jp-icon-download: url();
  --jp-icon-duplicate: url();
  --jp-icon-edit: url();
  --jp-icon-ellipses: url();
  --jp-icon-error: url();
  --jp-icon-expand-all: url();
  --jp-icon-extension: url();
  --jp-icon-fast-forward: url();
  --jp-icon-file-upload: url();
  --jp-icon-file: url();
  --jp-icon-filter-dot: url();
  --jp-icon-filter-list: url();
  --jp-icon-filter: url();
  --jp-icon-folder-favorite: url();
  --jp-icon-folder: url();
  --jp-icon-home: url();
  --jp-icon-html5: url();
  --jp-icon-image: url();
  --jp-icon-info: url();
  --jp-icon-inspector: url();
  --jp-icon-json: url();
  --jp-icon-julia: url();
  --jp-icon-jupyter-favicon: url();
  --jp-icon-jupyter: url();
  --jp-icon-jupyterlab-wordmark: url();
  --jp-icon-kernel: url();
  --jp-icon-keyboard: url();
  --jp-icon-launch: url();
  --jp-icon-launcher: url();
  --jp-icon-line-form: url();
  --jp-icon-link: url();
  --jp-icon-list: url();
  --jp-icon-markdown: url();
  --jp-icon-move-down: url();
  --jp-icon-move-up: url();
  --jp-icon-new-folder: url();
  --jp-icon-not-trusted: url();
  --jp-icon-notebook: url();
  --jp-icon-numbering: url();
  --jp-icon-offline-bolt: url();
  --jp-icon-palette: url();
  --jp-icon-paste: url();
  --jp-icon-pdf: url();
  --jp-icon-python: url();
  --jp-icon-r-kernel: url();
  --jp-icon-react: url();
  --jp-icon-redo: url();
  --jp-icon-refresh: url();
  --jp-icon-regex: url();
  --jp-icon-run: url();
  --jp-icon-running: url();
  --jp-icon-save: url();
  --jp-icon-search: url();
  --jp-icon-settings: url();
  --jp-icon-share: url();
  --jp-icon-spreadsheet: url();
  --jp-icon-stop: url();
  --jp-icon-tab: url();
  --jp-icon-table-rows: url();
  --jp-icon-tag: url();
  --jp-icon-terminal: url();
  --jp-icon-text-editor: url();
  --jp-icon-toc: url();
  --jp-icon-tree-view: url();
  --jp-icon-trusted: url();
  --jp-icon-undo: url();
  --jp-icon-user: url();
  --jp-icon-users: url();
  --jp-icon-vega: url();
  --jp-icon-word: url();
  --jp-icon-yaml: url();
}

/* Icon CSS class declarations */

.jp-AddAboveIcon {
  background-image: var(--jp-icon-add-above);
}

.jp-AddBelowIcon {
  background-image: var(--jp-icon-add-below);
}

.jp-AddIcon {
  background-image: var(--jp-icon-add);
}

.jp-BellIcon {
  background-image: var(--jp-icon-bell);
}

.jp-BugDotIcon {
  background-image: var(--jp-icon-bug-dot);
}

.jp-BugIcon {
  background-image: var(--jp-icon-bug);
}

.jp-BuildIcon {
  background-image: var(--jp-icon-build);
}

.jp-CaretDownEmptyIcon {
  background-image: var(--jp-icon-caret-down-empty);
}

.jp-CaretDownEmptyThinIcon {
  background-image: var(--jp-icon-caret-down-empty-thin);
}

.jp-CaretDownIcon {
  background-image: var(--jp-icon-caret-down);
}

.jp-CaretLeftIcon {
  background-image: var(--jp-icon-caret-left);
}

.jp-CaretRightIcon {
  background-image: var(--jp-icon-caret-right);
}

.jp-CaretUpEmptyThinIcon {
  background-image: var(--jp-icon-caret-up-empty-thin);
}

.jp-CaretUpIcon {
  background-image: var(--jp-icon-caret-up);
}

.jp-CaseSensitiveIcon {
  background-image: var(--jp-icon-case-sensitive);
}

.jp-CheckIcon {
  background-image: var(--jp-icon-check);
}

.jp-CircleEmptyIcon {
  background-image: var(--jp-icon-circle-empty);
}

.jp-CircleIcon {
  background-image: var(--jp-icon-circle);
}

.jp-ClearIcon {
  background-image: var(--jp-icon-clear);
}

.jp-CloseIcon {
  background-image: var(--jp-icon-close);
}

.jp-CodeCheckIcon {
  background-image: var(--jp-icon-code-check);
}

.jp-CodeIcon {
  background-image: var(--jp-icon-code);
}

.jp-CollapseAllIcon {
  background-image: var(--jp-icon-collapse-all);
}

.jp-ConsoleIcon {
  background-image: var(--jp-icon-console);
}

.jp-CopyIcon {
  background-image: var(--jp-icon-copy);
}

.jp-CopyrightIcon {
  background-image: var(--jp-icon-copyright);
}

.jp-CutIcon {
  background-image: var(--jp-icon-cut);
}

.jp-DeleteIcon {
  background-image: var(--jp-icon-delete);
}

.jp-DownloadIcon {
  background-image: var(--jp-icon-download);
}

.jp-DuplicateIcon {
  background-image: var(--jp-icon-duplicate);
}

.jp-EditIcon {
  background-image: var(--jp-icon-edit);
}

.jp-EllipsesIcon {
  background-image: var(--jp-icon-ellipses);
}

.jp-ErrorIcon {
  background-image: var(--jp-icon-error);
}

.jp-ExpandAllIcon {
  background-image: var(--jp-icon-expand-all);
}

.jp-ExtensionIcon {
  background-image: var(--jp-icon-extension);
}

.jp-FastForwardIcon {
  background-image: var(--jp-icon-fast-forward);
}

.jp-FileIcon {
  background-image: var(--jp-icon-file);
}

.jp-FileUploadIcon {
  background-image: var(--jp-icon-file-upload);
}

.jp-FilterDotIcon {
  background-image: var(--jp-icon-filter-dot);
}

.jp-FilterIcon {
  background-image: var(--jp-icon-filter);
}

.jp-FilterListIcon {
  background-image: var(--jp-icon-filter-list);
}

.jp-FolderFavoriteIcon {
  background-image: var(--jp-icon-folder-favorite);
}

.jp-FolderIcon {
  background-image: var(--jp-icon-folder);
}

.jp-HomeIcon {
  background-image: var(--jp-icon-home);
}

.jp-Html5Icon {
  background-image: var(--jp-icon-html5);
}

.jp-ImageIcon {
  background-image: var(--jp-icon-image);
}

.jp-InfoIcon {
  background-image: var(--jp-icon-info);
}

.jp-InspectorIcon {
  background-image: var(--jp-icon-inspector);
}

.jp-JsonIcon {
  background-image: var(--jp-icon-json);
}

.jp-JuliaIcon {
  background-image: var(--jp-icon-julia);
}

.jp-JupyterFaviconIcon {
  background-image: var(--jp-icon-jupyter-favicon);
}

.jp-JupyterIcon {
  background-image: var(--jp-icon-jupyter);
}

.jp-JupyterlabWordmarkIcon {
  background-image: var(--jp-icon-jupyterlab-wordmark);
}

.jp-KernelIcon {
  background-image: var(--jp-icon-kernel);
}

.jp-KeyboardIcon {
  background-image: var(--jp-icon-keyboard);
}

.jp-LaunchIcon {
  background-image: var(--jp-icon-launch);
}

.jp-LauncherIcon {
  background-image: var(--jp-icon-launcher);
}

.jp-LineFormIcon {
  background-image: var(--jp-icon-line-form);
}

.jp-LinkIcon {
  background-image: var(--jp-icon-link);
}

.jp-ListIcon {
  background-image: var(--jp-icon-list);
}

.jp-MarkdownIcon {
  background-image: var(--jp-icon-markdown);
}

.jp-MoveDownIcon {
  background-image: var(--jp-icon-move-down);
}

.jp-MoveUpIcon {
  background-image: var(--jp-icon-move-up);
}

.jp-NewFolderIcon {
  background-image: var(--jp-icon-new-folder);
}

.jp-NotTrustedIcon {
  background-image: var(--jp-icon-not-trusted);
}

.jp-NotebookIcon {
  background-image: var(--jp-icon-notebook);
}

.jp-NumberingIcon {
  background-image: var(--jp-icon-numbering);
}

.jp-OfflineBoltIcon {
  background-image: var(--jp-icon-offline-bolt);
}

.jp-PaletteIcon {
  background-image: var(--jp-icon-palette);
}

.jp-PasteIcon {
  background-image: var(--jp-icon-paste);
}

.jp-PdfIcon {
  background-image: var(--jp-icon-pdf);
}

.jp-PythonIcon {
  background-image: var(--jp-icon-python);
}

.jp-RKernelIcon {
  background-image: var(--jp-icon-r-kernel);
}

.jp-ReactIcon {
  background-image: var(--jp-icon-react);
}

.jp-RedoIcon {
  background-image: var(--jp-icon-redo);
}

.jp-RefreshIcon {
  background-image: var(--jp-icon-refresh);
}

.jp-RegexIcon {
  background-image: var(--jp-icon-regex);
}

.jp-RunIcon {
  background-image: var(--jp-icon-run);
}

.jp-RunningIcon {
  background-image: var(--jp-icon-running);
}

.jp-SaveIcon {
  background-image: var(--jp-icon-save);
}

.jp-SearchIcon {
  background-image: var(--jp-icon-search);
}

.jp-SettingsIcon {
  background-image: var(--jp-icon-settings);
}

.jp-ShareIcon {
  background-image: var(--jp-icon-share);
}

.jp-SpreadsheetIcon {
  background-image: var(--jp-icon-spreadsheet);
}

.jp-StopIcon {
  background-image: var(--jp-icon-stop);
}

.jp-TabIcon {
  background-image: var(--jp-icon-tab);
}

.jp-TableRowsIcon {
  background-image: var(--jp-icon-table-rows);
}

.jp-TagIcon {
  background-image: var(--jp-icon-tag);
}

.jp-TerminalIcon {
  background-image: var(--jp-icon-terminal);
}

.jp-TextEditorIcon {
  background-image: var(--jp-icon-text-editor);
}

.jp-TocIcon {
  background-image: var(--jp-icon-toc);
}

.jp-TreeViewIcon {
  background-image: var(--jp-icon-tree-view);
}

.jp-TrustedIcon {
  background-image: var(--jp-icon-trusted);
}

.jp-UndoIcon {
  background-image: var(--jp-icon-undo);
}

.jp-UserIcon {
  background-image: var(--jp-icon-user);
}

.jp-UsersIcon {
  background-image: var(--jp-icon-users);
}

.jp-VegaIcon {
  background-image: var(--jp-icon-vega);
}

.jp-WordIcon {
  background-image: var(--jp-icon-word);
}

.jp-YamlIcon {
  background-image: var(--jp-icon-yaml);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/**
 * (DEPRECATED) Support for consuming icons as CSS background images
 */

.jp-Icon,
.jp-MaterialIcon {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px;
  min-width: 16px;
  min-height: 16px;
}

.jp-Icon-cover {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/**
 * (DEPRECATED) Support for specific CSS icon sizes
 */

.jp-Icon-16 {
  background-size: 16px;
  min-width: 16px;
  min-height: 16px;
}

.jp-Icon-18 {
  background-size: 18px;
  min-width: 18px;
  min-height: 18px;
}

.jp-Icon-20 {
  background-size: 20px;
  min-width: 20px;
  min-height: 20px;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.lm-TabBar .lm-TabBar-addButton {
  align-items: center;
  display: flex;
  padding: 4px;
  padding-bottom: 5px;
  margin-right: 1px;
  background-color: var(--jp-layout-color2);
}

.lm-TabBar .lm-TabBar-addButton:hover {
  background-color: var(--jp-layout-color1);
}

.lm-DockPanel-tabBar .lm-TabBar-tab {
  width: var(--jp-private-horizontal-tab-width);
}

.lm-DockPanel-tabBar .lm-TabBar-content {
  flex: unset;
}

.lm-DockPanel-tabBar[data-orientation='horizontal'] {
  flex: 1 1 auto;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/**
 * Support for icons as inline SVG HTMLElements
 */

/* recolor the primary elements of an icon */
.jp-icon0[fill] {
  fill: var(--jp-inverse-layout-color0);
}

.jp-icon1[fill] {
  fill: var(--jp-inverse-layout-color1);
}

.jp-icon2[fill] {
  fill: var(--jp-inverse-layout-color2);
}

.jp-icon3[fill] {
  fill: var(--jp-inverse-layout-color3);
}

.jp-icon4[fill] {
  fill: var(--jp-inverse-layout-color4);
}

.jp-icon0[stroke] {
  stroke: var(--jp-inverse-layout-color0);
}

.jp-icon1[stroke] {
  stroke: var(--jp-inverse-layout-color1);
}

.jp-icon2[stroke] {
  stroke: var(--jp-inverse-layout-color2);
}

.jp-icon3[stroke] {
  stroke: var(--jp-inverse-layout-color3);
}

.jp-icon4[stroke] {
  stroke: var(--jp-inverse-layout-color4);
}

/* recolor the accent elements of an icon */
.jp-icon-accent0[fill] {
  fill: var(--jp-layout-color0);
}

.jp-icon-accent1[fill] {
  fill: var(--jp-layout-color1);
}

.jp-icon-accent2[fill] {
  fill: var(--jp-layout-color2);
}

.jp-icon-accent3[fill] {
  fill: var(--jp-layout-color3);
}

.jp-icon-accent4[fill] {
  fill: var(--jp-layout-color4);
}

.jp-icon-accent0[stroke] {
  stroke: var(--jp-layout-color0);
}

.jp-icon-accent1[stroke] {
  stroke: var(--jp-layout-color1);
}

.jp-icon-accent2[stroke] {
  stroke: var(--jp-layout-color2);
}

.jp-icon-accent3[stroke] {
  stroke: var(--jp-layout-color3);
}

.jp-icon-accent4[stroke] {
  stroke: var(--jp-layout-color4);
}

/* set the color of an icon to transparent */
.jp-icon-none[fill] {
  fill: none;
}

.jp-icon-none[stroke] {
  stroke: none;
}

/* brand icon colors. Same for light and dark */
.jp-icon-brand0[fill] {
  fill: var(--jp-brand-color0);
}

.jp-icon-brand1[fill] {
  fill: var(--jp-brand-color1);
}

.jp-icon-brand2[fill] {
  fill: var(--jp-brand-color2);
}

.jp-icon-brand3[fill] {
  fill: var(--jp-brand-color3);
}

.jp-icon-brand4[fill] {
  fill: var(--jp-brand-color4);
}

.jp-icon-brand0[stroke] {
  stroke: var(--jp-brand-color0);
}

.jp-icon-brand1[stroke] {
  stroke: var(--jp-brand-color1);
}

.jp-icon-brand2[stroke] {
  stroke: var(--jp-brand-color2);
}

.jp-icon-brand3[stroke] {
  stroke: var(--jp-brand-color3);
}

.jp-icon-brand4[stroke] {
  stroke: var(--jp-brand-color4);
}

/* warn icon colors. Same for light and dark */
.jp-icon-warn0[fill] {
  fill: var(--jp-warn-color0);
}

.jp-icon-warn1[fill] {
  fill: var(--jp-warn-color1);
}

.jp-icon-warn2[fill] {
  fill: var(--jp-warn-color2);
}

.jp-icon-warn3[fill] {
  fill: var(--jp-warn-color3);
}

.jp-icon-warn0[stroke] {
  stroke: var(--jp-warn-color0);
}

.jp-icon-warn1[stroke] {
  stroke: var(--jp-warn-color1);
}

.jp-icon-warn2[stroke] {
  stroke: var(--jp-warn-color2);
}

.jp-icon-warn3[stroke] {
  stroke: var(--jp-warn-color3);
}

/* icon colors that contrast well with each other and most backgrounds */
.jp-icon-contrast0[fill] {
  fill: var(--jp-icon-contrast-color0);
}

.jp-icon-contrast1[fill] {
  fill: var(--jp-icon-contrast-color1);
}

.jp-icon-contrast2[fill] {
  fill: var(--jp-icon-contrast-color2);
}

.jp-icon-contrast3[fill] {
  fill: var(--jp-icon-contrast-color3);
}

.jp-icon-contrast0[stroke] {
  stroke: var(--jp-icon-contrast-color0);
}

.jp-icon-contrast1[stroke] {
  stroke: var(--jp-icon-contrast-color1);
}

.jp-icon-contrast2[stroke] {
  stroke: var(--jp-icon-contrast-color2);
}

.jp-icon-contrast3[stroke] {
  stroke: var(--jp-icon-contrast-color3);
}

.jp-icon-dot[fill] {
  fill: var(--jp-warn-color0);
}

.jp-jupyter-icon-color[fill] {
  fill: var(--jp-jupyter-icon-color, var(--jp-warn-color0));
}

.jp-notebook-icon-color[fill] {
  fill: var(--jp-notebook-icon-color, var(--jp-warn-color0));
}

.jp-json-icon-color[fill] {
  fill: var(--jp-json-icon-color, var(--jp-warn-color1));
}

.jp-console-icon-color[fill] {
  fill: var(--jp-console-icon-color, white);
}

.jp-console-icon-background-color[fill] {
  fill: var(--jp-console-icon-background-color, var(--jp-brand-color1));
}

.jp-terminal-icon-color[fill] {
  fill: var(--jp-terminal-icon-color, var(--jp-layout-color2));
}

.jp-terminal-icon-background-color[fill] {
  fill: var(
    --jp-terminal-icon-background-color,
    var(--jp-inverse-layout-color2)
  );
}

.jp-text-editor-icon-color[fill] {
  fill: var(--jp-text-editor-icon-color, var(--jp-inverse-layout-color3));
}

.jp-inspector-icon-color[fill] {
  fill: var(--jp-inspector-icon-color, var(--jp-inverse-layout-color3));
}

/* CSS for icons in selected filebrowser listing items */
.jp-DirListing-item.jp-mod-selected .jp-icon-selectable[fill] {
  fill: #fff;
}

.jp-DirListing-item.jp-mod-selected .jp-icon-selectable-inverse[fill] {
  fill: var(--jp-brand-color1);
}

/* stylelint-disable selector-max-class, selector-max-compound-selectors */

/**
* TODO: come up with non css-hack solution for showing the busy icon on top
*  of the close icon
* CSS for complex behavior of close icon of tabs in the main area tabbar
*/
.lm-DockPanel-tabBar
  .lm-TabBar-tab.lm-mod-closable.jp-mod-dirty
  > .lm-TabBar-tabCloseIcon
  > :not(:hover)
  > .jp-icon3[fill] {
  fill: none;
}

.lm-DockPanel-tabBar
  .lm-TabBar-tab.lm-mod-closable.jp-mod-dirty
  > .lm-TabBar-tabCloseIcon
  > :not(:hover)
  > .jp-icon-busy[fill] {
  fill: var(--jp-inverse-layout-color3);
}

/* stylelint-enable selector-max-class, selector-max-compound-selectors */

/* CSS for icons in status bar */
#jp-main-statusbar .jp-mod-selected .jp-icon-selectable[fill] {
  fill: #fff;
}

#jp-main-statusbar .jp-mod-selected .jp-icon-selectable-inverse[fill] {
  fill: var(--jp-brand-color1);
}

/* special handling for splash icon CSS. While the theme CSS reloads during
   splash, the splash icon can loose theming. To prevent that, we set a
   default for its color variable */
:root {
  --jp-warn-color0: var(--md-orange-700);
}

/* not sure what to do with this one, used in filebrowser listing */
.jp-DragIcon {
  margin-right: 4px;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/**
 * Support for alt colors for icons as inline SVG HTMLElements
 */

/* alt recolor the primary elements of an icon */
.jp-icon-alt .jp-icon0[fill] {
  fill: var(--jp-layout-color0);
}

.jp-icon-alt .jp-icon1[fill] {
  fill: var(--jp-layout-color1);
}

.jp-icon-alt .jp-icon2[fill] {
  fill: var(--jp-layout-color2);
}

.jp-icon-alt .jp-icon3[fill] {
  fill: var(--jp-layout-color3);
}

.jp-icon-alt .jp-icon4[fill] {
  fill: var(--jp-layout-color4);
}

.jp-icon-alt .jp-icon0[stroke] {
  stroke: var(--jp-layout-color0);
}

.jp-icon-alt .jp-icon1[stroke] {
  stroke: var(--jp-layout-color1);
}

.jp-icon-alt .jp-icon2[stroke] {
  stroke: var(--jp-layout-color2);
}

.jp-icon-alt .jp-icon3[stroke] {
  stroke: var(--jp-layout-color3);
}

.jp-icon-alt .jp-icon4[stroke] {
  stroke: var(--jp-layout-color4);
}

/* alt recolor the accent elements of an icon */
.jp-icon-alt .jp-icon-accent0[fill] {
  fill: var(--jp-inverse-layout-color0);
}

.jp-icon-alt .jp-icon-accent1[fill] {
  fill: var(--jp-inverse-layout-color1);
}

.jp-icon-alt .jp-icon-accent2[fill] {
  fill: var(--jp-inverse-layout-color2);
}

.jp-icon-alt .jp-icon-accent3[fill] {
  fill: var(--jp-inverse-layout-color3);
}

.jp-icon-alt .jp-icon-accent4[fill] {
  fill: var(--jp-inverse-layout-color4);
}

.jp-icon-alt .jp-icon-accent0[stroke] {
  stroke: var(--jp-inverse-layout-color0);
}

.jp-icon-alt .jp-icon-accent1[stroke] {
  stroke: var(--jp-inverse-layout-color1);
}

.jp-icon-alt .jp-icon-accent2[stroke] {
  stroke: var(--jp-inverse-layout-color2);
}

.jp-icon-alt .jp-icon-accent3[stroke] {
  stroke: var(--jp-inverse-layout-color3);
}

.jp-icon-alt .jp-icon-accent4[stroke] {
  stroke: var(--jp-inverse-layout-color4);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-icon-hoverShow:not(:hover) .jp-icon-hoverShow-content {
  display: none !important;
}

/**
 * Support for hover colors for icons as inline SVG HTMLElements
 */

/**
 * regular colors
 */

/* recolor the primary elements of an icon */
.jp-icon-hover :hover .jp-icon0-hover[fill] {
  fill: var(--jp-inverse-layout-color0);
}

.jp-icon-hover :hover .jp-icon1-hover[fill] {
  fill: var(--jp-inverse-layout-color1);
}

.jp-icon-hover :hover .jp-icon2-hover[fill] {
  fill: var(--jp-inverse-layout-color2);
}

.jp-icon-hover :hover .jp-icon3-hover[fill] {
  fill: var(--jp-inverse-layout-color3);
}

.jp-icon-hover :hover .jp-icon4-hover[fill] {
  fill: var(--jp-inverse-layout-color4);
}

.jp-icon-hover :hover .jp-icon0-hover[stroke] {
  stroke: var(--jp-inverse-layout-color0);
}

.jp-icon-hover :hover .jp-icon1-hover[stroke] {
  stroke: var(--jp-inverse-layout-color1);
}

.jp-icon-hover :hover .jp-icon2-hover[stroke] {
  stroke: var(--jp-inverse-layout-color2);
}

.jp-icon-hover :hover .jp-icon3-hover[stroke] {
  stroke: var(--jp-inverse-layout-color3);
}

.jp-icon-hover :hover .jp-icon4-hover[stroke] {
  stroke: var(--jp-inverse-layout-color4);
}

/* recolor the accent elements of an icon */
.jp-icon-hover :hover .jp-icon-accent0-hover[fill] {
  fill: var(--jp-layout-color0);
}

.jp-icon-hover :hover .jp-icon-accent1-hover[fill] {
  fill: var(--jp-layout-color1);
}

.jp-icon-hover :hover .jp-icon-accent2-hover[fill] {
  fill: var(--jp-layout-color2);
}

.jp-icon-hover :hover .jp-icon-accent3-hover[fill] {
  fill: var(--jp-layout-color3);
}

.jp-icon-hover :hover .jp-icon-accent4-hover[fill] {
  fill: var(--jp-layout-color4);
}

.jp-icon-hover :hover .jp-icon-accent0-hover[stroke] {
  stroke: var(--jp-layout-color0);
}

.jp-icon-hover :hover .jp-icon-accent1-hover[stroke] {
  stroke: var(--jp-layout-color1);
}

.jp-icon-hover :hover .jp-icon-accent2-hover[stroke] {
  stroke: var(--jp-layout-color2);
}

.jp-icon-hover :hover .jp-icon-accent3-hover[stroke] {
  stroke: var(--jp-layout-color3);
}

.jp-icon-hover :hover .jp-icon-accent4-hover[stroke] {
  stroke: var(--jp-layout-color4);
}

/* set the color of an icon to transparent */
.jp-icon-hover :hover .jp-icon-none-hover[fill] {
  fill: none;
}

.jp-icon-hover :hover .jp-icon-none-hover[stroke] {
  stroke: none;
}

/**
 * inverse colors
 */

/* inverse recolor the primary elements of an icon */
.jp-icon-hover.jp-icon-alt :hover .jp-icon0-hover[fill] {
  fill: var(--jp-layout-color0);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon1-hover[fill] {
  fill: var(--jp-layout-color1);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon2-hover[fill] {
  fill: var(--jp-layout-color2);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon3-hover[fill] {
  fill: var(--jp-layout-color3);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon4-hover[fill] {
  fill: var(--jp-layout-color4);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon0-hover[stroke] {
  stroke: var(--jp-layout-color0);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon1-hover[stroke] {
  stroke: var(--jp-layout-color1);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon2-hover[stroke] {
  stroke: var(--jp-layout-color2);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon3-hover[stroke] {
  stroke: var(--jp-layout-color3);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon4-hover[stroke] {
  stroke: var(--jp-layout-color4);
}

/* inverse recolor the accent elements of an icon */
.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent0-hover[fill] {
  fill: var(--jp-inverse-layout-color0);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent1-hover[fill] {
  fill: var(--jp-inverse-layout-color1);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent2-hover[fill] {
  fill: var(--jp-inverse-layout-color2);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent3-hover[fill] {
  fill: var(--jp-inverse-layout-color3);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent4-hover[fill] {
  fill: var(--jp-inverse-layout-color4);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent0-hover[stroke] {
  stroke: var(--jp-inverse-layout-color0);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent1-hover[stroke] {
  stroke: var(--jp-inverse-layout-color1);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent2-hover[stroke] {
  stroke: var(--jp-inverse-layout-color2);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent3-hover[stroke] {
  stroke: var(--jp-inverse-layout-color3);
}

.jp-icon-hover.jp-icon-alt :hover .jp-icon-accent4-hover[stroke] {
  stroke: var(--jp-inverse-layout-color4);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-IFrame {
  width: 100%;
  height: 100%;
}

.jp-IFrame > iframe {
  border: none;
}

/*
When drag events occur, `lm-mod-override-cursor` is added to the body.
Because iframes steal all cursor events, the following two rules are necessary
to suppress pointer events while resize drags are occurring. There may be a
better solution to this problem.
*/
body.lm-mod-override-cursor .jp-IFrame {
  position: relative;
}

body.lm-mod-override-cursor .jp-IFrame::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: transparent;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2016, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-HoverBox {
  position: fixed;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-FormGroup-content fieldset {
  border: none;
  padding: 0;
  min-width: 0;
  width: 100%;
}

/* stylelint-disable selector-max-type */

.jp-FormGroup-content fieldset .jp-inputFieldWrapper input,
.jp-FormGroup-content fieldset .jp-inputFieldWrapper select,
.jp-FormGroup-content fieldset .jp-inputFieldWrapper textarea {
  font-size: var(--jp-content-font-size2);
  border-color: var(--jp-input-border-color);
  border-style: solid;
  border-radius: var(--jp-border-radius);
  border-width: 1px;
  padding: 6px 8px;
  background: none;
  color: var(--jp-ui-font-color0);
  height: inherit;
}

.jp-FormGroup-content fieldset input[type='checkbox'] {
  position: relative;
  top: 2px;
  margin-left: 0;
}

.jp-FormGroup-content button.jp-mod-styled {
  cursor: pointer;
}

.jp-FormGroup-content .checkbox label {
  cursor: pointer;
  font-size: var(--jp-content-font-size1);
}

.jp-FormGroup-content .jp-root > fieldset > legend {
  display: none;
}

.jp-FormGroup-content .jp-root > fieldset > p {
  display: none;
}

/** copy of `input.jp-mod-styled:focus` style */
.jp-FormGroup-content fieldset input:focus,
.jp-FormGroup-content fieldset select:focus {
  -moz-outline-radius: unset;
  outline: var(--jp-border-width) solid var(--md-blue-500);
  outline-offset: -1px;
  box-shadow: inset 0 0 4px var(--md-blue-300);
}

.jp-FormGroup-content fieldset input:hover:not(:focus),
.jp-FormGroup-content fieldset select:hover:not(:focus) {
  background-color: var(--jp-border-color2);
}

/* stylelint-enable selector-max-type */

.jp-FormGroup-content .checkbox .field-description {
  /* Disable default description field for checkbox:
   because other widgets do not have description fields,
   we add descriptions to each widget on the field level.
  */
  display: none;
}

.jp-FormGroup-content #root__description {
  display: none;
}

.jp-FormGroup-content .jp-modifiedIndicator {
  width: 5px;
  background-color: var(--jp-brand-color2);
  margin-top: 0;
  margin-left: calc(var(--jp-private-settingeditor-modifier-indent) * -1);
  flex-shrink: 0;
}

.jp-FormGroup-content .jp-modifiedIndicator.jp-errorIndicator {
  background-color: var(--jp-error-color0);
  margin-right: 0.5em;
}

/* RJSF ARRAY style */

.jp-arrayFieldWrapper legend {
  font-size: var(--jp-content-font-size2);
  color: var(--jp-ui-font-color0);
  flex-basis: 100%;
  padding: 4px 0;
  font-weight: var(--jp-content-heading-font-weight);
  border-bottom: 1px solid var(--jp-border-color2);
}

.jp-arrayFieldWrapper .field-description {
  padding: 4px 0;
  white-space: pre-wrap;
}

.jp-arrayFieldWrapper .array-item {
  width: 100%;
  border: 1px solid var(--jp-border-color2);
  border-radius: 4px;
  margin: 4px;
}

.jp-ArrayOperations {
  display: flex;
  margin-left: 8px;
}

.jp-ArrayOperationsButton {
  margin: 2px;
}

.jp-ArrayOperationsButton .jp-icon3[fill] {
  fill: var(--jp-ui-font-color0);
}

button.jp-ArrayOperationsButton.jp-mod-styled:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

/* RJSF form validation error */

.jp-FormGroup-content .validationErrors {
  color: var(--jp-error-color0);
}

/* Hide panel level error as duplicated the field level error */
.jp-FormGroup-content .panel.errors {
  display: none;
}

/* RJSF normal content (settings-editor) */

.jp-FormGroup-contentNormal {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.jp-FormGroup-contentNormal .jp-FormGroup-contentItem {
  margin-left: 7px;
  color: var(--jp-ui-font-color0);
}

.jp-FormGroup-contentNormal .jp-FormGroup-description {
  flex-basis: 100%;
  padding: 4px 7px;
}

.jp-FormGroup-contentNormal .jp-FormGroup-default {
  flex-basis: 100%;
  padding: 4px 7px;
}

.jp-FormGroup-contentNormal .jp-FormGroup-fieldLabel {
  font-size: var(--jp-content-font-size1);
  font-weight: normal;
  min-width: 120px;
}

.jp-FormGroup-contentNormal fieldset:not(:first-child) {
  margin-left: 7px;
}

.jp-FormGroup-contentNormal .field-array-of-string .array-item {
  /* Display `jp-ArrayOperations` buttons side-by-side with content except
    for small screens where flex-wrap will place them one below the other.
  */
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.jp-FormGroup-contentNormal .jp-objectFieldWrapper .form-group {
  padding: 2px 8px 2px var(--jp-private-settingeditor-modifier-indent);
  margin-top: 2px;
}

/* RJSF compact content (metadata-form) */

.jp-FormGroup-content.jp-FormGroup-contentCompact {
  width: 100%;
}

.jp-FormGroup-contentCompact .form-group {
  display: flex;
  padding: 0.5em 0.2em 0.5em 0;
}

.jp-FormGroup-contentCompact
  .jp-FormGroup-compactTitle
  .jp-FormGroup-description {
  font-size: var(--jp-ui-font-size1);
  color: var(--jp-ui-font-color2);
}

.jp-FormGroup-contentCompact .jp-FormGroup-fieldLabel {
  padding-bottom: 0.3em;
}

.jp-FormGroup-contentCompact .jp-inputFieldWrapper .form-control {
  width: 100%;
  box-sizing: border-box;
}

.jp-FormGroup-contentCompact .jp-arrayFieldWrapper .jp-FormGroup-compactTitle {
  padding-bottom: 7px;
}

.jp-FormGroup-contentCompact
  .jp-objectFieldWrapper
  .jp-objectFieldWrapper
  .form-group {
  padding: 2px 8px 2px var(--jp-private-settingeditor-modifier-indent);
  margin-top: 2px;
}

.jp-FormGroup-contentCompact ul.error-detail {
  margin-block-start: 0.5em;
  margin-block-end: 0.5em;
  padding-inline-start: 1em;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

.jp-SidePanel {
  display: flex;
  flex-direction: column;
  min-width: var(--jp-sidebar-min-width);
  overflow-y: auto;
  color: var(--jp-ui-font-color1);
  background: var(--jp-layout-color1);
  font-size: var(--jp-ui-font-size1);
}

.jp-SidePanel-header {
  flex: 0 0 auto;
  display: flex;
  border-bottom: var(--jp-border-width) solid var(--jp-border-color2);
  font-size: var(--jp-ui-font-size0);
  font-weight: 600;
  letter-spacing: 1px;
  margin: 0;
  padding: 2px;
  text-transform: uppercase;
}

.jp-SidePanel-toolbar {
  flex: 0 0 auto;
}

.jp-SidePanel-content {
  flex: 1 1 auto;
}

.jp-SidePanel-toolbar,
.jp-AccordionPanel-toolbar {
  height: var(--jp-private-toolbar-height);
}

.jp-SidePanel-toolbar.jp-Toolbar-micro {
  display: none;
}

.lm-AccordionPanel .jp-AccordionPanel-title {
  box-sizing: border-box;
  line-height: 25px;
  margin: 0;
  display: flex;
  align-items: center;
  background: var(--jp-layout-color1);
  color: var(--jp-ui-font-color1);
  border-bottom: var(--jp-border-width) solid var(--jp-toolbar-border-color);
  box-shadow: var(--jp-toolbar-box-shadow);
  font-size: var(--jp-ui-font-size0);
}

.jp-AccordionPanel-title {
  cursor: pointer;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  text-transform: uppercase;
}

.lm-AccordionPanel[data-orientation='horizontal'] > .jp-AccordionPanel-title {
  /* Title is rotated for horizontal accordion panel using CSS */
  display: block;
  transform-origin: top left;
  transform: rotate(-90deg) translate(-100%);
}

.jp-AccordionPanel-title .lm-AccordionPanel-titleLabel {
  user-select: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.jp-AccordionPanel-title .lm-AccordionPanel-titleCollapser {
  transform: rotate(-90deg);
  margin: auto 0;
  height: 16px;
}

.jp-AccordionPanel-title.lm-mod-expanded .lm-AccordionPanel-titleCollapser {
  transform: rotate(0deg);
}

.lm-AccordionPanel .jp-AccordionPanel-toolbar {
  background: none;
  box-shadow: none;
  border: none;
  margin-left: auto;
}

.lm-AccordionPanel .lm-SplitPanel-handle:hover {
  background: var(--jp-layout-color3);
}

.jp-text-truncated {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2017, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-Spinner {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: var(--jp-layout-color0);
  outline: none;
}

.jp-SpinnerContent {
  font-size: 10px;
  margin: 50px auto;
  text-indent: -9999em;
  width: 3em;
  height: 3em;
  border-radius: 50%;
  background: var(--jp-brand-color3);
  background: linear-gradient(
    to right,
    #f37626 10%,
    rgba(255, 255, 255, 0) 42%
  );
  position: relative;
  animation: load3 1s infinite linear, fadeIn 1s;
}

.jp-SpinnerContent::before {
  width: 50%;
  height: 50%;
  background: #f37626;
  border-radius: 100% 0 0;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}

.jp-SpinnerContent::after {
  background: var(--jp-layout-color0);
  width: 75%;
  height: 75%;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes load3 {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2017, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

button.jp-mod-styled {
  font-size: var(--jp-ui-font-size1);
  color: var(--jp-ui-font-color0);
  border: none;
  box-sizing: border-box;
  text-align: center;
  line-height: 32px;
  height: 32px;
  padding: 0 12px;
  letter-spacing: 0.8px;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

input.jp-mod-styled {
  background: var(--jp-input-background);
  height: 28px;
  box-sizing: border-box;
  border: var(--jp-border-width) solid var(--jp-border-color1);
  padding-left: 7px;
  padding-right: 7px;
  font-size: var(--jp-ui-font-size2);
  color: var(--jp-ui-font-color0);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

input[type='checkbox'].jp-mod-styled {
  appearance: checkbox;
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  height: auto;
}

input.jp-mod-styled:focus {
  border: var(--jp-border-width) solid var(--md-blue-500);
  box-shadow: inset 0 0 4px var(--md-blue-300);
}

.jp-select-wrapper {
  display: flex;
  position: relative;
  flex-direction: column;
  padding: 1px;
  background-color: var(--jp-layout-color1);
  box-sizing: border-box;
  margin-bottom: 12px;
}

.jp-select-wrapper:not(.multiple) {
  height: 28px;
}

.jp-select-wrapper.jp-mod-focused select.jp-mod-styled {
  border: var(--jp-border-width) solid var(--jp-input-active-border-color);
  box-shadow: var(--jp-input-box-shadow);
  background-color: var(--jp-input-active-background);
}

select.jp-mod-styled:hover {
  cursor: pointer;
  color: var(--jp-ui-font-color0);
  background-color: var(--jp-input-hover-background);
  box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5);
}

select.jp-mod-styled {
  flex: 1 1 auto;
  width: 100%;
  font-size: var(--jp-ui-font-size2);
  background: var(--jp-input-background);
  color: var(--jp-ui-font-color0);
  padding: 0 25px 0 8px;
  border: var(--jp-border-width) solid var(--jp-input-border-color);
  border-radius: 0;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

select.jp-mod-styled:not([multiple]) {
  height: 32px;
}

select.jp-mod-styled[multiple] {
  max-height: 200px;
  overflow-y: auto;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-switch {
  display: flex;
  align-items: center;
  padding-left: 4px;
  padding-right: 4px;
  font-size: var(--jp-ui-font-size1);
  background-color: transparent;
  color: var(--jp-ui-font-color1);
  border: none;
  height: 20px;
}

.jp-switch:hover {
  background-color: var(--jp-layout-color2);
}

.jp-switch-label {
  margin-right: 5px;
  font-family: var(--jp-ui-font-family);
}

.jp-switch-track {
  cursor: pointer;
  background-color: var(--jp-switch-color, var(--jp-border-color1));
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 34px;
  height: 16px;
  width: 35px;
  position: relative;
}

.jp-switch-track::before {
  content: '';
  position: absolute;
  height: 10px;
  width: 10px;
  margin: 3px;
  left: 0;
  background-color: var(--jp-ui-inverse-font-color1);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border-radius: 50%;
}

.jp-switch[aria-checked='true'] .jp-switch-track {
  background-color: var(--jp-switch-true-position-color, var(--jp-warn-color0));
}

.jp-switch[aria-checked='true'] .jp-switch-track::before {
  /* track width (35) - margins (3 + 3) - thumb width (10) */
  left: 19px;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2016, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

:root {
  --jp-private-toolbar-height: calc(
    28px + var(--jp-border-width)
  ); /* leave 28px for content */
}

.jp-Toolbar {
  color: var(--jp-ui-font-color1);
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  border-bottom: var(--jp-border-width) solid var(--jp-toolbar-border-color);
  box-shadow: var(--jp-toolbar-box-shadow);
  background: var(--jp-toolbar-background);
  min-height: var(--jp-toolbar-micro-height);
  padding: 2px;
  z-index: 8;
  overflow-x: hidden;
}

/* Toolbar items */

.jp-Toolbar > .jp-Toolbar-item.jp-Toolbar-spacer {
  flex-grow: 1;
  flex-shrink: 1;
}

.jp-Toolbar-item.jp-Toolbar-kernelStatus {
  display: inline-block;
  width: 32px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}

.jp-Toolbar > .jp-Toolbar-item {
  flex: 0 0 auto;
  display: flex;
  padding-left: 1px;
  padding-right: 1px;
  font-size: var(--jp-ui-font-size1);
  line-height: var(--jp-private-toolbar-height);
  height: 100%;
}

/* Toolbar buttons */

/* This is the div we use to wrap the react component into a Widget */
div.jp-ToolbarButton {
  color: transparent;
  border: none;
  box-sizing: border-box;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 0;
  margin: 0;
}

button.jp-ToolbarButtonComponent {
  background: var(--jp-layout-color1);
  border: none;
  box-sizing: border-box;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 0 6px;
  margin: 0;
  height: 24px;
  border-radius: var(--jp-border-radius);
  display: flex;
  align-items: center;
  text-align: center;
  font-size: 14px;
  min-width: unset;
  min-height: unset;
}

button.jp-ToolbarButtonComponent:disabled {
  opacity: 0.4;
}

button.jp-ToolbarButtonComponent > span {
  padding: 0;
  flex: 0 0 auto;
}

button.jp-ToolbarButtonComponent .jp-ToolbarButtonComponent-label {
  font-size: var(--jp-ui-font-size1);
  line-height: 100%;
  padding-left: 2px;
  color: var(--jp-ui-font-color1);
  font-family: var(--jp-ui-font-family);
}

#jp-main-dock-panel[data-mode='single-document']
  .jp-MainAreaWidget
  > .jp-Toolbar.jp-Toolbar-micro {
  padding: 0;
  min-height: 0;
}

#jp-main-dock-panel[data-mode='single-document']
  .jp-MainAreaWidget
  > .jp-Toolbar {
  border: none;
  box-shadow: none;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

.jp-WindowedPanel-outer {
  position: relative;
  overflow-y: auto;
}

.jp-WindowedPanel-inner {
  position: relative;
}

.jp-WindowedPanel-window {
  position: absolute;
  left: 0;
  right: 0;
  overflow: visible;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/* Sibling imports */

body {
  color: var(--jp-ui-font-color1);
  font-size: var(--jp-ui-font-size1);
}

/* Disable native link decoration styles everywhere outside of dialog boxes */
a {
  text-decoration: unset;
  color: unset;
}

a:hover {
  text-decoration: unset;
  color: unset;
}

/* Accessibility for links inside dialog box text */
.jp-Dialog-content a {
  text-decoration: revert;
  color: var(--jp-content-link-color);
}

.jp-Dialog-content a:hover {
  text-decoration: revert;
}

/* Styles for ui-components */
.jp-Button {
  color: var(--jp-ui-font-color2);
  border-radius: var(--jp-border-radius);
  padding: 0 12px;
  font-size: var(--jp-ui-font-size1);

  /* Copy from blueprint 3 */
  display: inline-flex;
  flex-direction: row;
  border: none;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  text-align: left;
  vertical-align: middle;
  min-height: 30px;
  min-width: 30px;
}

.jp-Button:disabled {
  cursor: not-allowed;
}

.jp-Button:empty {
  padding: 0 !important;
}

.jp-Button.jp-mod-small {
  min-height: 24px;
  min-width: 24px;
  font-size: 12px;
  padding: 0 7px;
}

/* Use our own theme for hover styles */
.jp-Button.jp-mod-minimal:hover {
  background-color: var(--jp-layout-color2);
}

.jp-Button.jp-mod-minimal {
  background: none;
}

.jp-InputGroup {
  display: block;
  position: relative;
}

.jp-InputGroup input {
  box-sizing: border-box;
  border: none;
  border-radius: 0;
  background-color: transparent;
  color: var(--jp-ui-font-color0);
  box-shadow: inset 0 0 0 var(--jp-border-width) var(--jp-input-border-color);
  padding-bottom: 0;
  padding-top: 0;
  padding-left: 10px;
  padding-right: 28px;
  position: relative;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 14px;
  font-weight: 400;
  height: 30px;
  line-height: 30px;
  outline: none;
  vertical-align: middle;
}

.jp-InputGroup input:focus {
  box-shadow: inset 0 0 0 var(--jp-border-width)
      var(--jp-input-active-box-shadow-color),
    inset 0 0 0 3px var(--jp-input-active-box-shadow-color);
}

.jp-InputGroup input:disabled {
  cursor: not-allowed;
  resize: block;
  background-color: var(--jp-layout-color2);
  color: var(--jp-ui-font-color2);
}

.jp-InputGroup input:disabled ~ span {
  cursor: not-allowed;
  color: var(--jp-ui-font-color2);
}

.jp-InputGroup input::placeholder,
input::placeholder {
  color: var(--jp-ui-font-color2);
}

.jp-InputGroupAction {
  position: absolute;
  bottom: 1px;
  right: 0;
  padding: 6px;
}

.jp-HTMLSelect.jp-DefaultStyle select {
  background-color: initial;
  border: none;
  border-radius: 0;
  box-shadow: none;
  color: var(--jp-ui-font-color0);
  display: block;
  font-size: var(--jp-ui-font-size1);
  font-family: var(--jp-ui-font-family);
  height: 24px;
  line-height: 14px;
  padding: 0 25px 0 10px;
  text-align: left;
  -moz-appearance: none;
  -webkit-appearance: none;
}

.jp-HTMLSelect.jp-DefaultStyle select:disabled {
  background-color: var(--jp-layout-color2);
  color: var(--jp-ui-font-color2);
  cursor: not-allowed;
  resize: block;
}

.jp-HTMLSelect.jp-DefaultStyle select:disabled ~ span {
  cursor: not-allowed;
}

/* Use our own theme for hover and option styles */
/* stylelint-disable-next-line selector-max-type */
.jp-HTMLSelect.jp-DefaultStyle select:hover,
.jp-HTMLSelect.jp-DefaultStyle select > option {
  background-color: var(--jp-layout-color2);
  color: var(--jp-ui-font-color0);
}

select {
  box-sizing: border-box;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Styles
|----------------------------------------------------------------------------*/

.jp-StatusBar-Widget {
  display: flex;
  align-items: center;
  background: var(--jp-layout-color2);
  min-height: var(--jp-statusbar-height);
  justify-content: space-between;
  padding: 0 10px;
}

.jp-StatusBar-Left {
  display: flex;
  align-items: center;
  flex-direction: row;
}

.jp-StatusBar-Middle {
  display: flex;
  align-items: center;
}

.jp-StatusBar-Right {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
}

.jp-StatusBar-Item {
  max-height: var(--jp-statusbar-height);
  margin: 0 2px;
  height: var(--jp-statusbar-height);
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--jp-ui-font-color1);
  padding: 0 6px;
}

.jp-mod-highlighted:hover {
  background-color: var(--jp-layout-color3);
}

.jp-mod-clicked {
  background-color: var(--jp-brand-color1);
}

.jp-mod-clicked:hover {
  background-color: var(--jp-brand-color0);
}

.jp-mod-clicked .jp-StatusBar-TextItem {
  color: var(--jp-ui-inverse-font-color1);
}

.jp-StatusBar-HoverItem {
  box-shadow: '0px 4px 4px rgba(0, 0, 0, 0.25)';
}

.jp-StatusBar-TextItem {
  font-size: var(--jp-ui-font-size1);
  font-family: var(--jp-ui-font-family);
  line-height: 24px;
  color: var(--jp-ui-font-color1);
}

.jp-StatusBar-GroupItem {
  display: flex;
  align-items: center;
  flex-direction: row;
}

.jp-Statusbar-ProgressCircle svg {
  display: block;
  margin: 0 auto;
  width: 16px;
  height: 24px;
  align-self: normal;
}

.jp-Statusbar-ProgressCircle path {
  fill: var(--jp-inverse-layout-color3);
}

.jp-Statusbar-ProgressBar-progress-bar {
  height: 10px;
  width: 100px;
  border: solid 0.25px var(--jp-brand-color2);
  border-radius: 3px;
  overflow: hidden;
  align-self: center;
}

.jp-Statusbar-ProgressBar-progress-bar > div {
  background-color: var(--jp-brand-color2);
  background-image: linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.2) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0.2) 75%,
    transparent 75%,
    transparent
  );
  background-size: 40px 40px;
  float: left;
  width: 0%;
  height: 100%;
  font-size: 12px;
  line-height: 14px;
  color: #fff;
  text-align: center;
  animation: jp-Statusbar-ExecutionTime-progress-bar 2s linear infinite;
}

.jp-Statusbar-ProgressBar-progress-bar p {
  color: var(--jp-ui-font-color1);
  font-family: var(--jp-ui-font-family);
  font-size: var(--jp-ui-font-size1);
  line-height: 10px;
  width: 100px;
}

@keyframes jp-Statusbar-ExecutionTime-progress-bar {
  0% {
    background-position: 0 0;
  }

  100% {
    background-position: 40px 40px;
  }
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Variables
|----------------------------------------------------------------------------*/

:root {
  --jp-private-commandpalette-search-height: 28px;
}

/*-----------------------------------------------------------------------------
| Overall styles
|----------------------------------------------------------------------------*/

.lm-CommandPalette {
  padding-bottom: 0;
  color: var(--jp-ui-font-color1);
  background: var(--jp-layout-color1);

  /* This is needed so that all font sizing of children done in ems is
   * relative to this base size */
  font-size: var(--jp-ui-font-size1);
}

/*-----------------------------------------------------------------------------
| Modal variant
|----------------------------------------------------------------------------*/

.jp-ModalCommandPalette {
  position: absolute;
  z-index: 10000;
  top: 38px;
  left: 30%;
  margin: 0;
  padding: 4px;
  width: 40%;
  box-shadow: var(--jp-elevation-z4);
  border-radius: 4px;
  background: var(--jp-layout-color0);
}

.jp-ModalCommandPalette .lm-CommandPalette {
  max-height: 40vh;
}

.jp-ModalCommandPalette .lm-CommandPalette .lm-close-icon::after {
  display: none;
}

.jp-ModalCommandPalette .lm-CommandPalette .lm-CommandPalette-header {
  display: none;
}

.jp-ModalCommandPalette .lm-CommandPalette .lm-CommandPalette-item {
  margin-left: 4px;
  margin-right: 4px;
}

.jp-ModalCommandPalette
  .lm-CommandPalette
  .lm-CommandPalette-item.lm-mod-disabled {
  display: none;
}

/*-----------------------------------------------------------------------------
| Search
|----------------------------------------------------------------------------*/

.lm-CommandPalette-search {
  padding: 4px;
  background-color: var(--jp-layout-color1);
  z-index: 2;
}

.lm-CommandPalette-wrapper {
  overflow: overlay;
  padding: 0 9px;
  background-color: var(--jp-input-active-background);
  height: 30px;
  box-shadow: inset 0 0 0 var(--jp-border-width) var(--jp-input-border-color);
}

.lm-CommandPalette.lm-mod-focused .lm-CommandPalette-wrapper {
  box-shadow: inset 0 0 0 1px var(--jp-input-active-box-shadow-color),
    inset 0 0 0 3px var(--jp-input-active-box-shadow-color);
}

.jp-SearchIconGroup {
  color: white;
  background-color: var(--jp-brand-color1);
  position: absolute;
  top: 4px;
  right: 4px;
  padding: 5px 5px 1px;
}

.jp-SearchIconGroup svg {
  height: 20px;
  width: 20px;
}

.jp-SearchIconGroup .jp-icon3[fill] {
  fill: var(--jp-layout-color0);
}

.lm-CommandPalette-input {
  background: transparent;
  width: calc(100% - 18px);
  float: left;
  border: none;
  outline: none;
  font-size: var(--jp-ui-font-size1);
  color: var(--jp-ui-font-color0);
  line-height: var(--jp-private-commandpalette-search-height);
}

.lm-CommandPalette-input::-webkit-input-placeholder,
.lm-CommandPalette-input::-moz-placeholder,
.lm-CommandPalette-input:-ms-input-placeholder {
  color: var(--jp-ui-font-color2);
  font-size: var(--jp-ui-font-size1);
}

/*-----------------------------------------------------------------------------
| Results
|----------------------------------------------------------------------------*/

.lm-CommandPalette-header:first-child {
  margin-top: 0;
}

.lm-CommandPalette-header {
  border-bottom: solid var(--jp-border-width) var(--jp-border-color2);
  color: var(--jp-ui-font-color1);
  cursor: pointer;
  display: flex;
  font-size: var(--jp-ui-font-size0);
  font-weight: 600;
  letter-spacing: 1px;
  margin-top: 8px;
  padding: 8px 0 8px 12px;
  text-transform: uppercase;
}

.lm-CommandPalette-header.lm-mod-active {
  background: var(--jp-layout-color2);
}

.lm-CommandPalette-header > mark {
  background-color: transparent;
  font-weight: bold;
  color: var(--jp-ui-font-color1);
}

.lm-CommandPalette-item {
  padding: 4px 12px 4px 4px;
  color: var(--jp-ui-font-color1);
  font-size: var(--jp-ui-font-size1);
  font-weight: 400;
  display: flex;
}

.lm-CommandPalette-item.lm-mod-disabled {
  color: var(--jp-ui-font-color2);
}

.lm-CommandPalette-item.lm-mod-active {
  color: var(--jp-ui-inverse-font-color1);
  background: var(--jp-brand-color1);
}

.lm-CommandPalette-item.lm-mod-active .lm-CommandPalette-itemLabel > mark {
  color: var(--jp-ui-inverse-font-color0);
}

.lm-CommandPalette-item.lm-mod-active .jp-icon-selectable[fill] {
  fill: var(--jp-layout-color0);
}

.lm-CommandPalette-item.lm-mod-active:hover:not(.lm-mod-disabled) {
  color: var(--jp-ui-inverse-font-color1);
  background: var(--jp-brand-color1);
}

.lm-CommandPalette-item:hover:not(.lm-mod-active):not(.lm-mod-disabled) {
  background: var(--jp-layout-color2);
}

.lm-CommandPalette-itemContent {
  overflow: hidden;
}

.lm-CommandPalette-itemLabel > mark {
  color: var(--jp-ui-font-color0);
  background-color: transparent;
  font-weight: bold;
}

.lm-CommandPalette-item.lm-mod-disabled mark {
  color: var(--jp-ui-font-color2);
}

.lm-CommandPalette-item .lm-CommandPalette-itemIcon {
  margin: 0 4px 0 0;
  position: relative;
  width: 16px;
  top: 2px;
  flex: 0 0 auto;
}

.lm-CommandPalette-item.lm-mod-disabled .lm-CommandPalette-itemIcon {
  opacity: 0.6;
}

.lm-CommandPalette-item .lm-CommandPalette-itemShortcut {
  flex: 0 0 auto;
}

.lm-CommandPalette-itemCaption {
  display: none;
}

.lm-CommandPalette-content {
  background-color: var(--jp-layout-color1);
}

.lm-CommandPalette-content:empty::after {
  content: 'No results';
  margin: auto;
  margin-top: 20px;
  width: 100px;
  display: block;
  font-size: var(--jp-ui-font-size2);
  font-family: var(--jp-ui-font-family);
  font-weight: lighter;
}

.lm-CommandPalette-emptyMessage {
  text-align: center;
  margin-top: 24px;
  line-height: 1.32;
  padding: 0 8px;
  color: var(--jp-content-font-color3);
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2017, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-Dialog {
  position: absolute;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background: var(--jp-dialog-background);
}

.jp-Dialog-content {
  display: flex;
  flex-direction: column;
  margin-left: auto;
  margin-right: auto;
  background: var(--jp-layout-color1);
  padding: 24px 24px 12px;
  min-width: 300px;
  min-height: 150px;
  max-width: 1000px;
  max-height: 500px;
  box-sizing: border-box;
  box-shadow: var(--jp-elevation-z20);
  word-wrap: break-word;
  border-radius: var(--jp-border-radius);

  /* This is needed so that all font sizing of children done in ems is
   * relative to this base size */
  font-size: var(--jp-ui-font-size1);
  color: var(--jp-ui-font-color1);
  resize: both;
}

.jp-Dialog-content.jp-Dialog-content-small {
  max-width: 500px;
}

.jp-Dialog-button {
  overflow: visible;
}

button.jp-Dialog-button:focus {
  outline: 1px solid var(--jp-brand-color1);
  outline-offset: 4px;
  -moz-outline-radius: 0;
}

button.jp-Dialog-button:focus::-moz-focus-inner {
  border: 0;
}

button.jp-Dialog-button.jp-mod-styled.jp-mod-accept:focus,
button.jp-Dialog-button.jp-mod-styled.jp-mod-warn:focus,
button.jp-Dialog-button.jp-mod-styled.jp-mod-reject:focus {
  outline-offset: 4px;
  -moz-outline-radius: 0;
}

button.jp-Dialog-button.jp-mod-styled.jp-mod-accept:focus {
  outline: 1px solid var(--jp-accept-color-normal, var(--jp-brand-color1));
}

button.jp-Dialog-button.jp-mod-styled.jp-mod-warn:focus {
  outline: 1px solid var(--jp-warn-color-normal, var(--jp-error-color1));
}

button.jp-Dialog-button.jp-mod-styled.jp-mod-reject:focus {
  outline: 1px solid var(--jp-reject-color-normal, var(--md-grey-600));
}

button.jp-Dialog-close-button {
  padding: 0;
  height: 100%;
  min-width: unset;
  min-height: unset;
}

.jp-Dialog-header {
  display: flex;
  justify-content: space-between;
  flex: 0 0 auto;
  padding-bottom: 12px;
  font-size: var(--jp-ui-font-size3);
  font-weight: 400;
  color: var(--jp-ui-font-color1);
}

.jp-Dialog-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  font-size: var(--jp-ui-font-size1);
  background: var(--jp-layout-color1);
  color: var(--jp-ui-font-color1);
  overflow: auto;
}

.jp-Dialog-footer {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  flex: 0 0 auto;
  margin-left: -12px;
  margin-right: -12px;
  padding: 12px;
}

.jp-Dialog-checkbox {
  padding-right: 5px;
}

.jp-Dialog-checkbox > input:focus-visible {
  outline: 1px solid var(--jp-input-active-border-color);
  outline-offset: 1px;
}

.jp-Dialog-spacer {
  flex: 1 1 auto;
}

.jp-Dialog-title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.jp-Dialog-body > .jp-select-wrapper {
  width: 100%;
}

.jp-Dialog-body > button {
  padding: 0 16px;
}

.jp-Dialog-body > label {
  line-height: 1.4;
  color: var(--jp-ui-font-color0);
}

.jp-Dialog-button.jp-mod-styled:not(:last-child) {
  margin-right: 12px;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

.jp-Input-Boolean-Dialog {
  flex-direction: row-reverse;
  align-items: end;
  width: 100%;
}

.jp-Input-Boolean-Dialog > label {
  flex: 1 1 auto;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2016, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-MainAreaWidget > :focus {
  outline: none;
}

.jp-MainAreaWidget .jp-MainAreaWidget-error {
  padding: 6px;
}

.jp-MainAreaWidget .jp-MainAreaWidget-error > pre {
  width: auto;
  padding: 10px;
  background: var(--jp-error-color3);
  border: var(--jp-border-width) solid var(--jp-error-color1);
  border-radius: var(--jp-border-radius);
  color: var(--jp-ui-font-color1);
  font-size: var(--jp-ui-font-size1);
  white-space: pre-wrap;
  word-wrap: break-word;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/**
 * google-material-color v1.2.6
 * https://github.com/danlevan/google-material-color
 */
:root {
  --md-red-50: #ffebee;
  --md-red-100: #ffcdd2;
  --md-red-200: #ef9a9a;
  --md-red-300: #e57373;
  --md-red-400: #ef5350;
  --md-red-500: #f44336;
  --md-red-600: #e53935;
  --md-red-700: #d32f2f;
  --md-red-800: #c62828;
  --md-red-900: #b71c1c;
  --md-red-A100: #ff8a80;
  --md-red-A200: #ff5252;
  --md-red-A400: #ff1744;
  --md-red-A700: #d50000;
  --md-pink-50: #fce4ec;
  --md-pink-100: #f8bbd0;
  --md-pink-200: #f48fb1;
  --md-pink-300: #f06292;
  --md-pink-400: #ec407a;
  --md-pink-500: #e91e63;
  --md-pink-600: #d81b60;
  --md-pink-700: #c2185b;
  --md-pink-800: #ad1457;
  --md-pink-900: #880e4f;
  --md-pink-A100: #ff80ab;
  --md-pink-A200: #ff4081;
  --md-pink-A400: #f50057;
  --md-pink-A700: #c51162;
  --md-purple-50: #f3e5f5;
  --md-purple-100: #e1bee7;
  --md-purple-200: #ce93d8;
  --md-purple-300: #ba68c8;
  --md-purple-400: #ab47bc;
  --md-purple-500: #9c27b0;
  --md-purple-600: #8e24aa;
  --md-purple-700: #7b1fa2;
  --md-purple-800: #6a1b9a;
  --md-purple-900: #4a148c;
  --md-purple-A100: #ea80fc;
  --md-purple-A200: #e040fb;
  --md-purple-A400: #d500f9;
  --md-purple-A700: #a0f;
  --md-deep-purple-50: #ede7f6;
  --md-deep-purple-100: #d1c4e9;
  --md-deep-purple-200: #b39ddb;
  --md-deep-purple-300: #9575cd;
  --md-deep-purple-400: #7e57c2;
  --md-deep-purple-500: #673ab7;
  --md-deep-purple-600: #5e35b1;
  --md-deep-purple-700: #512da8;
  --md-deep-purple-800: #4527a0;
  --md-deep-purple-900: #311b92;
  --md-deep-purple-A100: #b388ff;
  --md-deep-purple-A200: #7c4dff;
  --md-deep-purple-A400: #651fff;
  --md-deep-purple-A700: #6200ea;
  --md-indigo-50: #e8eaf6;
  --md-indigo-100: #c5cae9;
  --md-indigo-200: #9fa8da;
  --md-indigo-300: #7986cb;
  --md-indigo-400: #5c6bc0;
  --md-indigo-500: #3f51b5;
  --md-indigo-600: #3949ab;
  --md-indigo-700: #303f9f;
  --md-indigo-800: #283593;
  --md-indigo-900: #1a237e;
  --md-indigo-A100: #8c9eff;
  --md-indigo-A200: #536dfe;
  --md-indigo-A400: #3d5afe;
  --md-indigo-A700: #304ffe;
  --md-blue-50: #e3f2fd;
  --md-blue-100: #bbdefb;
  --md-blue-200: #90caf9;
  --md-blue-300: #64b5f6;
  --md-blue-400: #42a5f5;
  --md-blue-500: #2196f3;
  --md-blue-600: #1e88e5;
  --md-blue-700: #1976d2;
  --md-blue-800: #1565c0;
  --md-blue-900: #0d47a1;
  --md-blue-A100: #82b1ff;
  --md-blue-A200: #448aff;
  --md-blue-A400: #2979ff;
  --md-blue-A700: #2962ff;
  --md-light-blue-50: #e1f5fe;
  --md-light-blue-100: #b3e5fc;
  --md-light-blue-200: #81d4fa;
  --md-light-blue-300: #4fc3f7;
  --md-light-blue-400: #29b6f6;
  --md-light-blue-500: #03a9f4;
  --md-light-blue-600: #039be5;
  --md-light-blue-700: #0288d1;
  --md-light-blue-800: #0277bd;
  --md-light-blue-900: #01579b;
  --md-light-blue-A100: #80d8ff;
  --md-light-blue-A200: #40c4ff;
  --md-light-blue-A400: #00b0ff;
  --md-light-blue-A700: #0091ea;
  --md-cyan-50: #e0f7fa;
  --md-cyan-100: #b2ebf2;
  --md-cyan-200: #80deea;
  --md-cyan-300: #4dd0e1;
  --md-cyan-400: #26c6da;
  --md-cyan-500: #00bcd4;
  --md-cyan-600: #00acc1;
  --md-cyan-700: #0097a7;
  --md-cyan-800: #00838f;
  --md-cyan-900: #006064;
  --md-cyan-A100: #84ffff;
  --md-cyan-A200: #18ffff;
  --md-cyan-A400: #00e5ff;
  --md-cyan-A700: #00b8d4;
  --md-teal-50: #e0f2f1;
  --md-teal-100: #b2dfdb;
  --md-teal-200: #80cbc4;
  --md-teal-300: #4db6ac;
  --md-teal-400: #26a69a;
  --md-teal-500: #009688;
  --md-teal-600: #00897b;
  --md-teal-700: #00796b;
  --md-teal-800: #00695c;
  --md-teal-900: #004d40;
  --md-teal-A100: #a7ffeb;
  --md-teal-A200: #64ffda;
  --md-teal-A400: #1de9b6;
  --md-teal-A700: #00bfa5;
  --md-green-50: #e8f5e9;
  --md-green-100: #c8e6c9;
  --md-green-200: #a5d6a7;
  --md-green-300: #81c784;
  --md-green-400: #66bb6a;
  --md-green-500: #4caf50;
  --md-green-600: #43a047;
  --md-green-700: #388e3c;
  --md-green-800: #2e7d32;
  --md-green-900: #1b5e20;
  --md-green-A100: #b9f6ca;
  --md-green-A200: #69f0ae;
  --md-green-A400: #00e676;
  --md-green-A700: #00c853;
  --md-light-green-50: #f1f8e9;
  --md-light-green-100: #dcedc8;
  --md-light-green-200: #c5e1a5;
  --md-light-green-300: #aed581;
  --md-light-green-400: #9ccc65;
  --md-light-green-500: #8bc34a;
  --md-light-green-600: #7cb342;
  --md-light-green-700: #689f38;
  --md-light-green-800: #558b2f;
  --md-light-green-900: #33691e;
  --md-light-green-A100: #ccff90;
  --md-light-green-A200: #b2ff59;
  --md-light-green-A400: #76ff03;
  --md-light-green-A700: #64dd17;
  --md-lime-50: #f9fbe7;
  --md-lime-100: #f0f4c3;
  --md-lime-200: #e6ee9c;
  --md-lime-300: #dce775;
  --md-lime-400: #d4e157;
  --md-lime-500: #cddc39;
  --md-lime-600: #c0ca33;
  --md-lime-700: #afb42b;
  --md-lime-800: #9e9d24;
  --md-lime-900: #827717;
  --md-lime-A100: #f4ff81;
  --md-lime-A200: #eeff41;
  --md-lime-A400: #c6ff00;
  --md-lime-A700: #aeea00;
  --md-yellow-50: #fffde7;
  --md-yellow-100: #fff9c4;
  --md-yellow-200: #fff59d;
  --md-yellow-300: #fff176;
  --md-yellow-400: #ffee58;
  --md-yellow-500: #ffeb3b;
  --md-yellow-600: #fdd835;
  --md-yellow-700: #fbc02d;
  --md-yellow-800: #f9a825;
  --md-yellow-900: #f57f17;
  --md-yellow-A100: #ffff8d;
  --md-yellow-A200: #ff0;
  --md-yellow-A400: #ffea00;
  --md-yellow-A700: #ffd600;
  --md-amber-50: #fff8e1;
  --md-amber-100: #ffecb3;
  --md-amber-200: #ffe082;
  --md-amber-300: #ffd54f;
  --md-amber-400: #ffca28;
  --md-amber-500: #ffc107;
  --md-amber-600: #ffb300;
  --md-amber-700: #ffa000;
  --md-amber-800: #ff8f00;
  --md-amber-900: #ff6f00;
  --md-amber-A100: #ffe57f;
  --md-amber-A200: #ffd740;
  --md-amber-A400: #ffc400;
  --md-amber-A700: #ffab00;
  --md-orange-50: #fff3e0;
  --md-orange-100: #ffe0b2;
  --md-orange-200: #ffcc80;
  --md-orange-300: #ffb74d;
  --md-orange-400: #ffa726;
  --md-orange-500: #ff9800;
  --md-orange-600: #fb8c00;
  --md-orange-700: #f57c00;
  --md-orange-800: #ef6c00;
  --md-orange-900: #e65100;
  --md-orange-A100: #ffd180;
  --md-orange-A200: #ffab40;
  --md-orange-A400: #ff9100;
  --md-orange-A700: #ff6d00;
  --md-deep-orange-50: #fbe9e7;
  --md-deep-orange-100: #ffccbc;
  --md-deep-orange-200: #ffab91;
  --md-deep-orange-300: #ff8a65;
  --md-deep-orange-400: #ff7043;
  --md-deep-orange-500: #ff5722;
  --md-deep-orange-600: #f4511e;
  --md-deep-orange-700: #e64a19;
  --md-deep-orange-800: #d84315;
  --md-deep-orange-900: #bf360c;
  --md-deep-orange-A100: #ff9e80;
  --md-deep-orange-A200: #ff6e40;
  --md-deep-orange-A400: #ff3d00;
  --md-deep-orange-A700: #dd2c00;
  --md-brown-50: #efebe9;
  --md-brown-100: #d7ccc8;
  --md-brown-200: #bcaaa4;
  --md-brown-300: #a1887f;
  --md-brown-400: #8d6e63;
  --md-brown-500: #795548;
  --md-brown-600: #6d4c41;
  --md-brown-700: #5d4037;
  --md-brown-800: #4e342e;
  --md-brown-900: #3e2723;
  --md-grey-50: #fafafa;
  --md-grey-100: #f5f5f5;
  --md-grey-200: #eee;
  --md-grey-300: #e0e0e0;
  --md-grey-400: #bdbdbd;
  --md-grey-500: #9e9e9e;
  --md-grey-600: #757575;
  --md-grey-700: #616161;
  --md-grey-800: #424242;
  --md-grey-900: #212121;
  --md-blue-grey-50: #eceff1;
  --md-blue-grey-100: #cfd8dc;
  --md-blue-grey-200: #b0bec5;
  --md-blue-grey-300: #90a4ae;
  --md-blue-grey-400: #78909c;
  --md-blue-grey-500: #607d8b;
  --md-blue-grey-600: #546e7a;
  --md-blue-grey-700: #455a64;
  --md-blue-grey-800: #37474f;
  --md-blue-grey-900: #263238;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2017, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| RenderedText
|----------------------------------------------------------------------------*/

:root {
  /* This is the padding value to fill the gaps between lines containing spans with background color. */
  --jp-private-code-span-padding: calc(
    (var(--jp-code-line-height) - 1) * var(--jp-code-font-size) / 2
  );
}

.jp-RenderedText {
  text-align: left;
  padding-left: var(--jp-code-padding);
  line-height: var(--jp-code-line-height);
  font-family: var(--jp-code-font-family);
}

.jp-RenderedText pre,
.jp-RenderedJavaScript pre,
.jp-RenderedHTMLCommon pre {
  color: var(--jp-content-font-color1);
  font-size: var(--jp-code-font-size);
  border: none;
  margin: 0;
  padding: 0;
}

.jp-RenderedText pre a:link {
  text-decoration: none;
  color: var(--jp-content-link-color);
}

.jp-RenderedText pre a:hover {
  text-decoration: underline;
  color: var(--jp-content-link-color);
}

.jp-RenderedText pre a:visited {
  text-decoration: none;
  color: var(--jp-content-link-color);
}

/* console foregrounds and backgrounds */
.jp-RenderedText pre .ansi-black-fg {
  color: #3e424d;
}

.jp-RenderedText pre .ansi-red-fg {
  color: #e75c58;
}

.jp-RenderedText pre .ansi-green-fg {
  color: #00a250;
}

.jp-RenderedText pre .ansi-yellow-fg {
  color: #ddb62b;
}

.jp-RenderedText pre .ansi-blue-fg {
  color: #208ffb;
}

.jp-RenderedText pre .ansi-magenta-fg {
  color: #d160c4;
}

.jp-RenderedText pre .ansi-cyan-fg {
  color: #60c6c8;
}

.jp-RenderedText pre .ansi-white-fg {
  color: #c5c1b4;
}

.jp-RenderedText pre .ansi-black-bg {
  background-color: #3e424d;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-red-bg {
  background-color: #e75c58;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-green-bg {
  background-color: #00a250;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-yellow-bg {
  background-color: #ddb62b;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-blue-bg {
  background-color: #208ffb;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-magenta-bg {
  background-color: #d160c4;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-cyan-bg {
  background-color: #60c6c8;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-white-bg {
  background-color: #c5c1b4;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-black-intense-fg {
  color: #282c36;
}

.jp-RenderedText pre .ansi-red-intense-fg {
  color: #b22b31;
}

.jp-RenderedText pre .ansi-green-intense-fg {
  color: #007427;
}

.jp-RenderedText pre .ansi-yellow-intense-fg {
  color: #b27d12;
}

.jp-RenderedText pre .ansi-blue-intense-fg {
  color: #0065ca;
}

.jp-RenderedText pre .ansi-magenta-intense-fg {
  color: #a03196;
}

.jp-RenderedText pre .ansi-cyan-intense-fg {
  color: #258f8f;
}

.jp-RenderedText pre .ansi-white-intense-fg {
  color: #a1a6b2;
}

.jp-RenderedText pre .ansi-black-intense-bg {
  background-color: #282c36;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-red-intense-bg {
  background-color: #b22b31;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-green-intense-bg {
  background-color: #007427;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-yellow-intense-bg {
  background-color: #b27d12;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-blue-intense-bg {
  background-color: #0065ca;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-magenta-intense-bg {
  background-color: #a03196;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-cyan-intense-bg {
  background-color: #258f8f;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-white-intense-bg {
  background-color: #a1a6b2;
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-default-inverse-fg {
  color: var(--jp-ui-inverse-font-color0);
}

.jp-RenderedText pre .ansi-default-inverse-bg {
  background-color: var(--jp-inverse-layout-color0);
  padding: var(--jp-private-code-span-padding) 0;
}

.jp-RenderedText pre .ansi-bold {
  font-weight: bold;
}

.jp-RenderedText pre .ansi-underline {
  text-decoration: underline;
}

.jp-RenderedText[data-mime-type='application/vnd.jupyter.stderr'] {
  background: var(--jp-rendermime-error-background);
  padding-top: var(--jp-code-padding);
}

/*-----------------------------------------------------------------------------
| RenderedLatex
|----------------------------------------------------------------------------*/

.jp-RenderedLatex {
  color: var(--jp-content-font-color1);
  font-size: var(--jp-content-font-size1);
  line-height: var(--jp-content-line-height);
}

/* Left-justify outputs.*/
.jp-OutputArea-output.jp-RenderedLatex {
  padding: var(--jp-code-padding);
  text-align: left;
}

/*-----------------------------------------------------------------------------
| RenderedHTML
|----------------------------------------------------------------------------*/

.jp-RenderedHTMLCommon {
  color: var(--jp-content-font-color1);
  font-family: var(--jp-content-font-family);
  font-size: var(--jp-content-font-size1);
  line-height: var(--jp-content-line-height);

  /* Give a bit more R padding on Markdown text to keep line lengths reasonable */
  padding-right: 20px;
}

.jp-RenderedHTMLCommon em {
  font-style: italic;
}

.jp-RenderedHTMLCommon strong {
  font-weight: bold;
}

.jp-RenderedHTMLCommon u {
  text-decoration: underline;
}

.jp-RenderedHTMLCommon a:link {
  text-decoration: none;
  color: var(--jp-content-link-color);
}

.jp-RenderedHTMLCommon a:hover {
  text-decoration: underline;
  color: var(--jp-content-link-color);
}

.jp-RenderedHTMLCommon a:visited {
  text-decoration: none;
  color: var(--jp-content-link-color);
}

/* Headings */

.jp-RenderedHTMLCommon h1,
.jp-RenderedHTMLCommon h2,
.jp-RenderedHTMLCommon h3,
.jp-RenderedHTMLCommon h4,
.jp-RenderedHTMLCommon h5,
.jp-RenderedHTMLCommon h6 {
  line-height: var(--jp-content-heading-line-height);
  font-weight: var(--jp-content-heading-font-weight);
  font-style: normal;
  margin: var(--jp-content-heading-margin-top) 0
    var(--jp-content-heading-margin-bottom) 0;
}

.jp-RenderedHTMLCommon h1:first-child,
.jp-RenderedHTMLCommon h2:first-child,
.jp-RenderedHTMLCommon h3:first-child,
.jp-RenderedHTMLCommon h4:first-child,
.jp-RenderedHTMLCommon h5:first-child,
.jp-RenderedHTMLCommon h6:first-child {
  margin-top: calc(0.5 * var(--jp-content-heading-margin-top));
}

.jp-RenderedHTMLCommon h1:last-child,
.jp-RenderedHTMLCommon h2:last-child,
.jp-RenderedHTMLCommon h3:last-child,
.jp-RenderedHTMLCommon h4:last-child,
.jp-RenderedHTMLCommon h5:last-child,
.jp-RenderedHTMLCommon h6:last-child {
  margin-bottom: calc(0.5 * var(--jp-content-heading-margin-bottom));
}

.jp-RenderedHTMLCommon h1 {
  font-size: var(--jp-content-font-size5);
}

.jp-RenderedHTMLCommon h2 {
  font-size: var(--jp-content-font-size4);
}

.jp-RenderedHTMLCommon h3 {
  font-size: var(--jp-content-font-size3);
}

.jp-RenderedHTMLCommon h4 {
  font-size: var(--jp-content-font-size2);
}

.jp-RenderedHTMLCommon h5 {
  font-size: var(--jp-content-font-size1);
}

.jp-RenderedHTMLCommon h6 {
  font-size: var(--jp-content-font-size0);
}

/* Lists */

/* stylelint-disable selector-max-type, selector-max-compound-selectors */

.jp-RenderedHTMLCommon ul:not(.list-inline),
.jp-RenderedHTMLCommon ol:not(.list-inline) {
  padding-left: 2em;
}

.jp-RenderedHTMLCommon ul {
  list-style: disc;
}

.jp-RenderedHTMLCommon ul ul {
  list-style: square;
}

.jp-RenderedHTMLCommon ul ul ul {
  list-style: circle;
}

.jp-RenderedHTMLCommon ol {
  list-style: decimal;
}

.jp-RenderedHTMLCommon ol ol {
  list-style: upper-alpha;
}

.jp-RenderedHTMLCommon ol ol ol {
  list-style: lower-alpha;
}

.jp-RenderedHTMLCommon ol ol ol ol {
  list-style: lower-roman;
}

.jp-RenderedHTMLCommon ol ol ol ol ol {
  list-style: decimal;
}

.jp-RenderedHTMLCommon ol,
.jp-RenderedHTMLCommon ul {
  margin-bottom: 1em;
}

.jp-RenderedHTMLCommon ul ul,
.jp-RenderedHTMLCommon ul ol,
.jp-RenderedHTMLCommon ol ul,
.jp-RenderedHTMLCommon ol ol {
  margin-bottom: 0;
}

/* stylelint-enable selector-max-type, selector-max-compound-selectors */

.jp-RenderedHTMLCommon hr {
  color: var(--jp-border-color2);
  background-color: var(--jp-border-color1);
  margin-top: 1em;
  margin-bottom: 1em;
}

.jp-RenderedHTMLCommon > pre {
  margin: 1.5em 2em;
}

.jp-RenderedHTMLCommon pre,
.jp-RenderedHTMLCommon code {
  border: 0;
  background-color: var(--jp-layout-color0);
  color: var(--jp-content-font-color1);
  font-family: var(--jp-code-font-family);
  font-size: inherit;
  line-height: var(--jp-code-line-height);
  padding: 0;
  white-space: pre-wrap;
}

.jp-RenderedHTMLCommon :not(pre) > code {
  background-color: var(--jp-layout-color2);
  padding: 1px 5px;
}

/* Tables */

.jp-RenderedHTMLCommon table {
  border-collapse: collapse;
  border-spacing: 0;
  border: none;
  color: var(--jp-ui-font-color1);
  font-size: var(--jp-ui-font-size1);
  table-layout: fixed;
  margin-left: auto;
  margin-bottom: 1em;
  margin-right: auto;
}

.jp-RenderedHTMLCommon thead {
  border-bottom: var(--jp-border-width) solid var(--jp-border-color1);
  vertical-align: bottom;
}

.jp-RenderedHTMLCommon td,
.jp-RenderedHTMLCommon th,
.jp-RenderedHTMLCommon tr {
  vertical-align: middle;
  padding: 0.5em;
  line-height: normal;
  white-space: normal;
  max-width: none;
  border: none;
}

.jp-RenderedMarkdown.jp-RenderedHTMLCommon td,
.jp-RenderedMarkdown.jp-RenderedHTMLCommon th {
  max-width: none;
}

:not(.jp-RenderedMarkdown).jp-RenderedHTMLCommon td,
:not(.jp-RenderedMarkdown).jp-RenderedHTMLCommon th,
:not(.jp-RenderedMarkdown).jp-RenderedHTMLCommon tr {
  text-align: right;
}

.jp-RenderedHTMLCommon th {
  font-weight: bold;
}

.jp-RenderedHTMLCommon tbody tr:nth-child(odd) {
  background: var(--jp-layout-color0);
}

.jp-RenderedHTMLCommon tbody tr:nth-child(even) {
  background: var(--jp-rendermime-table-row-background);
}

.jp-RenderedHTMLCommon tbody tr:hover {
  background: var(--jp-rendermime-table-row-hover-background);
}

.jp-RenderedHTMLCommon p {
  text-align: left;
  margin: 0;
  margin-bottom: 1em;
}

.jp-RenderedHTMLCommon img {
  -moz-force-broken-image-icon: 1;
}

/* Restrict to direct children as other images could be nested in other content. */
.jp-RenderedHTMLCommon > img {
  display: block;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 1em;
}

/* Change color behind transparent images if they need it... */
[data-jp-theme-light='false'] .jp-RenderedImage img.jp-needs-light-background {
  background-color: var(--jp-inverse-layout-color1);
}

[data-jp-theme-light='true'] .jp-RenderedImage img.jp-needs-dark-background {
  background-color: var(--jp-inverse-layout-color1);
}

.jp-RenderedHTMLCommon img,
.jp-RenderedImage img,
.jp-RenderedHTMLCommon svg,
.jp-RenderedSVG svg {
  max-width: 100%;
  height: auto;
}

.jp-RenderedHTMLCommon img.jp-mod-unconfined,
.jp-RenderedImage img.jp-mod-unconfined,
.jp-RenderedHTMLCommon svg.jp-mod-unconfined,
.jp-RenderedSVG svg.jp-mod-unconfined {
  max-width: none;
}

.jp-RenderedHTMLCommon .alert {
  padding: var(--jp-notebook-padding);
  border: var(--jp-border-width) solid transparent;
  border-radius: var(--jp-border-radius);
  margin-bottom: 1em;
}

.jp-RenderedHTMLCommon .alert-info {
  color: var(--jp-info-color0);
  background-color: var(--jp-info-color3);
  border-color: var(--jp-info-color2);
}

.jp-RenderedHTMLCommon .alert-info hr {
  border-color: var(--jp-info-color3);
}

.jp-RenderedHTMLCommon .alert-info > p:last-child,
.jp-RenderedHTMLCommon .alert-info > ul:last-child {
  margin-bottom: 0;
}

.jp-RenderedHTMLCommon .alert-warning {
  color: var(--jp-warn-color0);
  background-color: var(--jp-warn-color3);
  border-color: var(--jp-warn-color2);
}

.jp-RenderedHTMLCommon .alert-warning hr {
  border-color: var(--jp-warn-color3);
}

.jp-RenderedHTMLCommon .alert-warning > p:last-child,
.jp-RenderedHTMLCommon .alert-warning > ul:last-child {
  margin-bottom: 0;
}

.jp-RenderedHTMLCommon .alert-success {
  color: var(--jp-success-color0);
  background-color: var(--jp-success-color3);
  border-color: var(--jp-success-color2);
}

.jp-RenderedHTMLCommon .alert-success hr {
  border-color: var(--jp-success-color3);
}

.jp-RenderedHTMLCommon .alert-success > p:last-child,
.jp-RenderedHTMLCommon .alert-success > ul:last-child {
  margin-bottom: 0;
}

.jp-RenderedHTMLCommon .alert-danger {
  color: var(--jp-error-color0);
  background-color: var(--jp-error-color3);
  border-color: var(--jp-error-color2);
}

.jp-RenderedHTMLCommon .alert-danger hr {
  border-color: var(--jp-error-color3);
}

.jp-RenderedHTMLCommon .alert-danger > p:last-child,
.jp-RenderedHTMLCommon .alert-danger > ul:last-child {
  margin-bottom: 0;
}

.jp-RenderedHTMLCommon blockquote {
  margin: 1em 2em;
  padding: 0 1em;
  border-left: 5px solid var(--jp-border-color2);
}

a.jp-InternalAnchorLink {
  visibility: hidden;
  margin-left: 8px;
  color: var(--md-blue-800);
}

h1:hover .jp-InternalAnchorLink,
h2:hover .jp-InternalAnchorLink,
h3:hover .jp-InternalAnchorLink,
h4:hover .jp-InternalAnchorLink,
h5:hover .jp-InternalAnchorLink,
h6:hover .jp-InternalAnchorLink {
  visibility: visible;
}

.jp-RenderedHTMLCommon kbd {
  background-color: var(--jp-rendermime-table-row-background);
  border: 1px solid var(--jp-border-color0);
  border-bottom-color: var(--jp-border-color2);
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
  display: inline-block;
  font-size: var(--jp-ui-font-size0);
  line-height: 1em;
  padding: 0.2em 0.5em;
}

/* Most direct children of .jp-RenderedHTMLCommon have a margin-bottom of 1.0.
 * At the bottom of cells this is a bit too much as there is also spacing
 * between cells. Going all the way to 0 gets too tight between markdown and
 * code cells.
 */
.jp-RenderedHTMLCommon > *:last-child {
  margin-bottom: 0.5em;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Copyright (c) 2014-2017, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/

.lm-cursor-backdrop {
  position: fixed;
  width: 200px;
  height: 200px;
  margin-top: -100px;
  margin-left: -100px;
  will-change: transform;
  z-index: 100;
}

.lm-mod-drag-image {
  will-change: transform;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

.jp-lineFormSearch {
  padding: 4px 12px;
  background-color: var(--jp-layout-color2);
  box-shadow: var(--jp-toolbar-box-shadow);
  z-index: 2;
  font-size: var(--jp-ui-font-size1);
}

.jp-lineFormCaption {
  font-size: var(--jp-ui-font-size0);
  line-height: var(--jp-ui-font-size1);
  margin-top: 4px;
  color: var(--jp-ui-font-color0);
}

.jp-baseLineForm {
  border: none;
  border-radius: 0;
  position: absolute;
  background-size: 16px;
  background-repeat: no-repeat;
  background-position: center;
  outline: none;
}

.jp-lineFormButtonContainer {
  top: 4px;
  right: 8px;
  height: 24px;
  padding: 0 12px;
  width: 12px;
}

.jp-lineFormButtonIcon {
  top: 0;
  right: 0;
  background-color: var(--jp-brand-color1);
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  padding: 4px 6px;
}

.jp-lineFormButton {
  top: 0;
  right: 0;
  background-color: transparent;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
}

.jp-lineFormWrapper {
  overflow: hidden;
  padding: 0 8px;
  border: 1px solid var(--jp-border-color0);
  background-color: var(--jp-input-active-background);
  height: 22px;
}

.jp-lineFormWrapperFocusWithin {
  border: var(--jp-border-width) solid var(--md-blue-500);
  box-shadow: inset 0 0 4px var(--md-blue-300);
}

.jp-lineFormInput {
  background: transparent;
  width: 200px;
  height: 100%;
  border: none;
  outline: none;
  color: var(--jp-ui-font-color0);
  line-height: 28px;
}

/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2016, Jupyter Development Team.
|
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-JSONEditor {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.jp-JSONEditor-host {
  flex: 1 1 auto;
  border: var(--jp-border-width) solid var(--jp-input-border-color);
  border-radius: 0;
  background: var(--jp-layout-color0);
  min-height: 50px;
  padding: 1px;
}

.jp-JSONEditor.jp-mod-error .jp-JSONEditor-host {
  border-color: red;
  outline-color: red;
}

.jp-JSONEditor-header {
  display: flex;
  flex: 1 0 auto;
  padding: 0 0 0 12px;
}

.jp-JSONEditor-header label {
  flex: 0 0 auto;
}

.jp-JSONEditor-commitButton {
  height: 16px;
  width: 16px;
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: center;
}

.jp-JSONEditor-host.jp-mod-focused {
  background-color: var(--jp-input-active-background);
  border: 1px solid var(--jp-input-active-border-color);
  box-shadow: var(--jp-input-box-shadow);
}

.jp-Editor.jp-mod-dropTarget {
  border: var(--jp-border-width) solid var(--jp-input-active-border-color);
  box-shadow: var(--jp-input-box-shadow);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/
.jp-DocumentSearch-input {
  border: none;
  outline: none;
  color: var(--jp-ui-font-color0);
  font-size: var(--jp-ui-font-size1);
  background-color: var(--jp-layout-color0);
  font-family: var(--jp-ui-font-family);
  padding: 2px 1px;
  resize: none;
}

.jp-DocumentSearch-overlay {
  position: absolute;
  background-color: var(--jp-toolbar-background);
  border-bottom: var(--jp-border-width) solid var(--jp-toolbar-border-color);
  border-left: var(--jp-border-width) solid var(--jp-toolbar-border-color);
  top: 0;
  right: 0;
  z-index: 7;
  min-width: 405px;
  padding: 2px;
  font-size: var(--jp-ui-font-size1);

  --jp-private-document-search-button-height: 20px;
}

.jp-DocumentSearch-overlay button {
  background-color: var(--jp-toolbar-background);
  outline: 0;
}

.jp-DocumentSearch-overlay button:hover {
  background-color: var(--jp-layout-color2);
}

.jp-DocumentSearch-overlay button:active {
  background-color: var(--jp-layout-color3);
}

.jp-DocumentSearch-overlay-row {
  display: flex;
  align-items: center;
  margin-bottom: 2px;
}

.jp-DocumentSearch-button-content {
  display: inline-block;
  cursor: pointer;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
}

.jp-DocumentSearch-button-content svg {
  width: 100%;
  height: 100%;
}

.jp-DocumentSearch-input-wrapper {
  border: var(--jp-border-width) solid var(--jp-border-color0);
  display: flex;
  background-color: var(--jp-layout-color0);
  margin: 2px;
}

.jp-DocumentSearch-input-wrapper:focus-within {
  border-color: var(--jp-cell-editor-active-border-color);
}

.jp-DocumentSearch-toggle-wrapper,
.jp-DocumentSearch-button-wrapper {
  all: initial;
  overflow: hidden;
  display: inline-block;
  border: none;
  box-sizing: border-box;
}

.jp-DocumentSearch-toggle-wrapper {
  width: 14px;
  height: 14px;
}

.jp-DocumentSearch-button-wrapper {
  width: var(--jp-private-document-search-button-height);
  height: var(--jp-private-document-search-button-height);
}

.jp-DocumentSearch-toggle-wrapper:focus,
.jp-DocumentSearch-button-wrapper:focus {
  outline: var(--jp-border-width) solid
    var(--jp-cell-editor-active-border-color);
  outline-offset: -1px;
}

.jp-DocumentSearch-toggle-wrapper,
.jp-DocumentSearch-button-wrapper,
.jp-DocumentSearch-button-content:focus {
  outline: none;
}

.jp-DocumentSearch-toggle-placeholder {
  width: 5px;
}

.jp-DocumentSearch-input-button::before {
  display: block;
  padding-top: 100%;
}

.jp-DocumentSearch-input-button-off {
  opacity: var(--jp-search-toggle-off-opacity);
}

.jp-DocumentSearch-input-button-off:hover {
  opacity: var(--jp-search-toggle-hover-opacity);
}

.jp-DocumentSearch-input-button-on {
  opacity: var(--jp-search-toggle-on-opacity);
}

.jp-DocumentSearch-index-counter {
  padding-left: 10px;
  padding-right: 10px;
  user-select: none;
  min-width: 35px;
  display: inline-block;
}

.jp-DocumentSearch-up-down-wrapper {
  display: inline-block;
  padding-right: 2px;
  margin-left: auto;
  white-space: nowrap;
}

.jp-DocumentSearch-spacer {
  margin-left: auto;
}

.jp-DocumentSearch-up-down-wrapper button {
  outline: 0;
  border: none;
  width: var(--jp-private-document-search-button-height);
  height: var(--jp-private-document-search-button-height);
  vertical-align: middle;
  margin: 1px 5px 2px;
}

.jp-DocumentSearch-up-down-button:hover {
  background-color: var(--jp-layout-color2);
}

.jp-DocumentSearch-up-down-button:active {
  background-color: var(--jp-layout-color3);
}

.jp-DocumentSearch-filter-button {
  border-radius: var(--jp-border-radius);
}

.jp-DocumentSearch-filter-button:hover {
  background-color: var(--jp-layout-color2);
}

.jp-DocumentSearch-filter-button-enabled {
  background-color: var(--jp-layout-color2);
}

.jp-DocumentSearch-filter-button-enabled:hover {
  background-color: var(--jp-layout-color3);
}

.jp-DocumentSearch-search-options {
  padding: 0 8px;
  margin-left: 3px;
  width: 100%;
  display: grid;
  justify-content: start;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  justify-items: stretch;
}

.jp-DocumentSearch-search-filter-disabled {
  color: var(--jp-ui-font-color2);
}

.jp-DocumentSearch-search-filter {
  display: flex;
  align-items: center;
  user-select: none;
}

.jp-DocumentSearch-regex-error {
  color: var(--jp-error-color0);
}

.jp-DocumentSearch-replace-button-wrapper {
  overflow: hidden;
  display: inline-block;
  box-sizing: border-box;
  border: var(--jp-border-width) solid var(--jp-border-color0);
  margin: auto 2px;
  padding: 1px 4px;
  height: calc(var(--jp-private-document-search-button-height) + 2px);
}

.jp-DocumentSearch-replace-button-wrapper:focus {
  border: var(--jp-border-width) solid var(--jp-cell-editor-active-border-color);
}

.jp-DocumentSearch-replace-button {
  display: inline-block;
  text-align: center;
  cursor: pointer;
  box-sizing: border-box;
  color: var(--jp-ui-font-color1);

  /* height - 2 * (padding of wrapper) */
  line-height: calc(var(--jp-private-document-search-button-height) - 2px);
  width: 100%;
  height: 100%;
}

.jp-DocumentSearch-replace-button:focus {
  outline: none;
}

.jp-DocumentSearch-replace-wrapper-class {
  margin-left: 14px;
  display: flex;
}

.jp-DocumentSearch-replace-toggle {
  border: none;
  background-color: var(--jp-toolbar-background);
  border-radius: var(--jp-border-radius);
}

.jp-DocumentSearch-replace-toggle:hover {
  background-color: var(--jp-layout-color2);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.cm-editor {
  line-height: var(--jp-code-line-height);
  font-size: var(--jp-code-font-size);
  font-family: var(--jp-code-font-family);
  border: 0;
  border-radius: 0;
  height: auto;

  /* Changed to auto to autogrow */
}

.cm-editor pre {
  padding: 0 var(--jp-code-padding);
}

.jp-CodeMirrorEditor[data-type='inline'] .cm-dialog {
  background-color: var(--jp-layout-color0);
  color: var(--jp-content-font-color1);
}

.jp-CodeMirrorEditor {
  cursor: text;
}

/* When zoomed out 67% and 33% on a screen of 1440 width x 900 height */
@media screen and (min-width: 2138px) and (max-width: 4319px) {
  .jp-CodeMirrorEditor[data-type='inline'] .cm-cursor {
    border-left: var(--jp-code-cursor-width1) solid
      var(--jp-editor-cursor-color);
  }
}

/* When zoomed out less than 33% */
@media screen and (min-width: 4320px) {
  .jp-CodeMirrorEditor[data-type='inline'] .cm-cursor {
    border-left: var(--jp-code-cursor-width2) solid
      var(--jp-editor-cursor-color);
  }
}

.cm-editor.jp-mod-readOnly .cm-cursor {
  display: none;
}

.jp-CollaboratorCursor {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: none;
  border-bottom: 3px solid;
  background-clip: content-box;
  margin-left: -5px;
  margin-right: -5px;
}

.cm-searching,
.cm-searching span {
  /* `.cm-searching span`: we need to override syntax highlighting */
  background-color: var(--jp-search-unselected-match-background-color);
  color: var(--jp-search-unselected-match-color);
}

.cm-searching::selection,
.cm-searching span::selection {
  background-color: var(--jp-search-unselected-match-background-color);
  color: var(--jp-search-unselected-match-color);
}

.jp-current-match > .cm-searching,
.jp-current-match > .cm-searching span,
.cm-searching > .jp-current-match,
.cm-searching > .jp-current-match span {
  background-color: var(--jp-search-selected-match-background-color);
  color: var(--jp-search-selected-match-color);
}

.jp-current-match > .cm-searching::selection,
.cm-searching > .jp-current-match::selection,
.jp-current-match > .cm-searching span::selection {
  background-color: var(--jp-search-selected-match-background-color);
  color: var(--jp-search-selected-match-color);
}

.cm-trailingspace {
  background-image: url();
  background-position: center left;
  background-repeat: repeat-x;
}

.jp-CollaboratorCursor-hover {
  position: absolute;
  z-index: 1;
  transform: translateX(-50%);
  color: white;
  border-radius: 3px;
  padding-left: 4px;
  padding-right: 4px;
  padding-top: 1px;
  padding-bottom: 1px;
  text-align: center;
  font-size: var(--jp-ui-font-size1);
  white-space: nowrap;
}

.jp-CodeMirror-ruler {
  border-left: 1px dashed var(--jp-border-color2);
}

/* Styles for shared cursors (remote cursor locations and selected ranges) */
.jp-CodeMirrorEditor .cm-ySelectionCaret {
  position: relative;
  border-left: 1px solid black;
  margin-left: -1px;
  margin-right: -1px;
  box-sizing: border-box;
}

.jp-CodeMirrorEditor .cm-ySelectionCaret > .cm-ySelectionInfo {
  white-space: nowrap;
  position: absolute;
  top: -1.15em;
  padding-bottom: 0.05em;
  left: -1px;
  font-size: 0.95em;
  font-family: var(--jp-ui-font-family);
  font-weight: bold;
  line-height: normal;
  user-select: none;
  color: white;
  padding-left: 2px;
  padding-right: 2px;
  z-index: 101;
  transition: opacity 0.3s ease-in-out;
}

.jp-CodeMirrorEditor .cm-ySelectionInfo {
  transition-delay: 0.7s;
  opacity: 0;
}

.jp-CodeMirrorEditor .cm-ySelectionCaret:hover > .cm-ySelectionInfo {
  opacity: 1;
  transition-delay: 0s;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-MimeDocument {
  outline: none;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Variables
|----------------------------------------------------------------------------*/

:root {
  --jp-private-filebrowser-button-height: 28px;
  --jp-private-filebrowser-button-width: 48px;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-FileBrowser .jp-SidePanel-content {
  display: flex;
  flex-direction: column;
}

.jp-FileBrowser-toolbar.jp-Toolbar {
  flex-wrap: wrap;
  row-gap: 12px;
  border-bottom: none;
  height: auto;
  margin: 8px 12px 0;
  box-shadow: none;
  padding: 0;
  justify-content: flex-start;
}

.jp-FileBrowser-Panel {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}

.jp-BreadCrumbs {
  flex: 0 0 auto;
  margin: 8px 12px;
}

.jp-BreadCrumbs-item {
  margin: 0 2px;
  padding: 0 2px;
  border-radius: var(--jp-border-radius);
  cursor: pointer;
}

.jp-BreadCrumbs-item:hover {
  background-color: var(--jp-layout-color2);
}

.jp-BreadCrumbs-item:first-child {
  margin-left: 0;
}

.jp-BreadCrumbs-item.jp-mod-dropTarget {
  background-color: var(--jp-brand-color2);
  opacity: 0.7;
}

/*-----------------------------------------------------------------------------
| Buttons
|----------------------------------------------------------------------------*/

.jp-FileBrowser-toolbar > .jp-Toolbar-item {
  flex: 0 0 auto;
  padding-left: 0;
  padding-right: 2px;
  align-items: center;
  height: unset;
}

.jp-FileBrowser-toolbar > .jp-Toolbar-item .jp-ToolbarButtonComponent {
  width: 40px;
}

/*-----------------------------------------------------------------------------
| Other styles
|----------------------------------------------------------------------------*/

.jp-FileDialog.jp-mod-conflict input {
  color: var(--jp-error-color1);
}

.jp-FileDialog .jp-new-name-title {
  margin-top: 12px;
}

.jp-LastModified-hidden {
  display: none;
}

.jp-FileSize-hidden {
  display: none;
}

.jp-FileBrowser .lm-AccordionPanel > h3:first-child {
  display: none;
}

/*-----------------------------------------------------------------------------
| DirListing
|----------------------------------------------------------------------------*/

.jp-DirListing {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  outline: 0;
}

.jp-DirListing-header {
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  overflow: hidden;
  border-top: var(--jp-border-width) solid var(--jp-border-color2);
  border-bottom: var(--jp-border-width) solid var(--jp-border-color1);
  box-shadow: var(--jp-toolbar-box-shadow);
  z-index: 2;
}

.jp-DirListing-headerItem {
  padding: 4px 12px 2px;
  font-weight: 500;
}

.jp-DirListing-headerItem:hover {
  background: var(--jp-layout-color2);
}

.jp-DirListing-headerItem.jp-id-name {
  flex: 1 0 84px;
}

.jp-DirListing-headerItem.jp-id-modified {
  flex: 0 0 112px;
  border-left: var(--jp-border-width) solid var(--jp-border-color2);
  text-align: right;
}

.jp-DirListing-headerItem.jp-id-filesize {
  flex: 0 0 75px;
  border-left: var(--jp-border-width) solid var(--jp-border-color2);
  text-align: right;
}

.jp-id-narrow {
  display: none;
  flex: 0 0 5px;
  padding: 4px;
  border-left: var(--jp-border-width) solid var(--jp-border-color2);
  text-align: right;
  color: var(--jp-border-color2);
}

.jp-DirListing-narrow .jp-id-narrow {
  display: block;
}

.jp-DirListing-narrow .jp-id-modified,
.jp-DirListing-narrow .jp-DirListing-itemModified {
  display: none;
}

.jp-DirListing-headerItem.jp-mod-selected {
  font-weight: 600;
}

/* increase specificity to override bundled default */
.jp-DirListing-content {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  list-style-type: none;
  overflow: auto;
  background-color: var(--jp-layout-color1);
}

.jp-DirListing-content mark {
  color: var(--jp-ui-font-color0);
  background-color: transparent;
  font-weight: bold;
}

.jp-DirListing-content .jp-DirListing-item.jp-mod-selected mark {
  color: var(--jp-ui-inverse-font-color0);
}

/* Style the directory listing content when a user drops a file to upload */
.jp-DirListing.jp-mod-native-drop .jp-DirListing-content {
  outline: 5px dashed rgba(128, 128, 128, 0.5);
  outline-offset: -10px;
  cursor: copy;
}

.jp-DirListing-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 4px 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.jp-DirListing-checkboxWrapper {
  /* Increases hit area of checkbox. */
  padding: 4px;
}

.jp-DirListing-header
  .jp-DirListing-checkboxWrapper
  + .jp-DirListing-headerItem {
  padding-left: 4px;
}

.jp-DirListing-content .jp-DirListing-checkboxWrapper {
  position: relative;
  left: -4px;
  margin: -4px 0 -4px -8px;
}

.jp-DirListing-checkboxWrapper.jp-mod-visible {
  visibility: visible;
}

/* For devices that support hovering, hide checkboxes until hovered, selected...
*/
@media (hover: hover) {
  .jp-DirListing-checkboxWrapper {
    visibility: hidden;
  }

  .jp-DirListing-item:hover .jp-DirListing-checkboxWrapper,
  .jp-DirListing-item.jp-mod-selected .jp-DirListing-checkboxWrapper {
    visibility: visible;
  }
}

.jp-DirListing-item[data-is-dot] {
  opacity: 75%;
}

.jp-DirListing-item.jp-mod-selected {
  color: var(--jp-ui-inverse-font-color1);
  background: var(--jp-brand-color1);
}

.jp-DirListing-item.jp-mod-dropTarget {
  background: var(--jp-brand-color3);
}

.jp-DirListing-item:hover:not(.jp-mod-selected) {
  background: var(--jp-layout-color2);
}

.jp-DirListing-itemIcon {
  flex: 0 0 20px;
  margin-right: 4px;
}

.jp-DirListing-itemText {
  flex: 1 0 64px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  user-select: none;
}

.jp-DirListing-itemText:focus {
  outline-width: 2px;
  outline-color: var(--jp-inverse-layout-color1);
  outline-style: solid;
  outline-offset: 1px;
}

.jp-DirListing-item.jp-mod-selected .jp-DirListing-itemText:focus {
  outline-color: var(--jp-layout-color1);
}

.jp-DirListing-itemModified {
  flex: 0 0 125px;
  text-align: right;
}

.jp-DirListing-itemFileSize {
  flex: 0 0 90px;
  text-align: right;
}

.jp-DirListing-editor {
  flex: 1 0 64px;
  outline: none;
  border: none;
  color: var(--jp-ui-font-color1);
  background-color: var(--jp-layout-color1);
}

.jp-DirListing-item.jp-mod-running .jp-DirListing-itemIcon::before {
  color: var(--jp-success-color1);
  content: '\25CF';
  font-size: 8px;
  position: absolute;
  left: -8px;
}

.jp-DirListing-item.jp-mod-running.jp-mod-selected
  .jp-DirListing-itemIcon::before {
  color: var(--jp-ui-inverse-font-color1);
}

.jp-DirListing-item.lm-mod-drag-image,
.jp-DirListing-item.jp-mod-selected.lm-mod-drag-image {
  font-size: var(--jp-ui-font-size1);
  padding-left: 4px;
  margin-left: 4px;
  width: 160px;
  background-color: var(--jp-ui-inverse-font-color2);
  box-shadow: var(--jp-elevation-z2);
  border-radius: 0;
  color: var(--jp-ui-font-color1);
  transform: translateX(-40%) translateY(-58%);
}

.jp-Document {
  min-width: 120px;
  min-height: 120px;
  outline: none;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Main OutputArea
| OutputArea has a list of Outputs
|----------------------------------------------------------------------------*/

.jp-OutputArea {
  overflow-y: auto;
}

.jp-OutputArea-child {
  display: table;
  table-layout: fixed;
  width: 100%;
  overflow: hidden;
}

.jp-OutputPrompt {
  width: var(--jp-cell-prompt-width);
  color: var(--jp-cell-outprompt-font-color);
  font-family: var(--jp-cell-prompt-font-family);
  padding: var(--jp-code-padding);
  letter-spacing: var(--jp-cell-prompt-letter-spacing);
  line-height: var(--jp-code-line-height);
  font-size: var(--jp-code-font-size);
  border: var(--jp-border-width) solid transparent;
  opacity: var(--jp-cell-prompt-opacity);

  /* Right align prompt text, don't wrap to handle large prompt numbers */
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  /* Disable text selection */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.jp-OutputArea-prompt {
  display: table-cell;
  vertical-align: top;
}

.jp-OutputArea-output {
  display: table-cell;
  width: 100%;
  height: auto;
  overflow: auto;
  user-select: text;
  -moz-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
}

.jp-OutputArea .jp-RenderedText {
  padding-left: 1ch;
}

/**
 * Prompt overlay.
 */

.jp-OutputArea-promptOverlay {
  position: absolute;
  top: 0;
  width: var(--jp-cell-prompt-width);
  height: 100%;
  opacity: 0.5;
}

.jp-OutputArea-promptOverlay:hover {
  background: var(--jp-layout-color2);
  box-shadow: inset 0 0 1px var(--jp-inverse-layout-color0);
  cursor: zoom-out;
}

.jp-mod-outputsScrolled .jp-OutputArea-promptOverlay:hover {
  cursor: zoom-in;
}

/**
 * Isolated output.
 */
.jp-OutputArea-output.jp-mod-isolated {
  width: 100%;
  display: block;
}

/*
When drag events occur, `lm-mod-override-cursor` is added to the body.
Because iframes steal all cursor events, the following two rules are necessary
to suppress pointer events while resize drags are occurring. There may be a
better solution to this problem.
*/
body.lm-mod-override-cursor .jp-OutputArea-output.jp-mod-isolated {
  position: relative;
}

body.lm-mod-override-cursor .jp-OutputArea-output.jp-mod-isolated::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: transparent;
}

/* pre */

.jp-OutputArea-output pre {
  border: none;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  overflow-y: auto;
  word-break: break-all;
  word-wrap: break-word;
  white-space: pre-wrap;
}

/* tables */

.jp-OutputArea-output.jp-RenderedHTMLCommon table {
  margin-left: 0;
  margin-right: 0;
}

/* description lists */

.jp-OutputArea-output dl,
.jp-OutputArea-output dt,
.jp-OutputArea-output dd {
  display: block;
}

.jp-OutputArea-output dl {
  width: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0;
}

.jp-OutputArea-output dt {
  font-weight: bold;
  float: left;
  width: 20%;
  padding: 0;
  margin: 0;
}

.jp-OutputArea-output dd {
  float: left;
  width: 80%;
  padding: 0;
  margin: 0;
}

.jp-TrimmedOutputs pre {
  background: var(--jp-layout-color3);
  font-size: calc(var(--jp-code-font-size) * 1.4);
  text-align: center;
  text-transform: uppercase;
}

/* Hide the gutter in case of
 *  - nested output areas (e.g. in the case of output widgets)
 *  - mirrored output areas
 */
.jp-OutputArea .jp-OutputArea .jp-OutputArea-prompt {
  display: none;
}

/* Hide empty lines in the output area, for instance due to cleared widgets */
.jp-OutputArea-prompt:empty {
  padding: 0;
  border: 0;
}

/*-----------------------------------------------------------------------------
| executeResult is added to any Output-result for the display of the object
| returned by a cell
|----------------------------------------------------------------------------*/

.jp-OutputArea-output.jp-OutputArea-executeResult {
  margin-left: 0;
  width: 100%;
}

/* Text output with the Out[] prompt needs a top padding to match the
 * alignment of the Out[] prompt itself.
 */
.jp-OutputArea-executeResult .jp-RenderedText.jp-OutputArea-output {
  padding-top: var(--jp-code-padding);
  border-top: var(--jp-border-width) solid transparent;
}

/*-----------------------------------------------------------------------------
| The Stdin output
|----------------------------------------------------------------------------*/

.jp-Stdin-prompt {
  color: var(--jp-content-font-color0);
  padding-right: var(--jp-code-padding);
  vertical-align: baseline;
  flex: 0 0 auto;
}

.jp-Stdin-input {
  font-family: var(--jp-code-font-family);
  font-size: inherit;
  color: inherit;
  background-color: inherit;
  width: 42%;
  min-width: 200px;

  /* make sure input baseline aligns with prompt */
  vertical-align: baseline;

  /* padding + margin = 0.5em between prompt and cursor */
  padding: 0 0.25em;
  margin: 0 0.25em;
  flex: 0 0 70%;
}

.jp-Stdin-input::placeholder {
  opacity: 0;
}

.jp-Stdin-input:focus {
  box-shadow: none;
}

.jp-Stdin-input:focus::placeholder {
  opacity: 1;
}

/*-----------------------------------------------------------------------------
| Output Area View
|----------------------------------------------------------------------------*/

.jp-LinkedOutputView .jp-OutputArea {
  height: 100%;
  display: block;
}

.jp-LinkedOutputView .jp-OutputArea-output:only-child {
  height: 100%;
}

/*-----------------------------------------------------------------------------
| Printing
|----------------------------------------------------------------------------*/

@media print {
  .jp-OutputArea-child {
    break-inside: avoid-page;
  }
}

/*-----------------------------------------------------------------------------
| Mobile
|----------------------------------------------------------------------------*/
@media only screen and (max-width: 760px) {
  .jp-OutputPrompt {
    display: table-row;
    text-align: left;
  }

  .jp-OutputArea-child .jp-OutputArea-output {
    display: table-row;
    margin-left: var(--jp-notebook-padding);
  }
}

/* Trimmed outputs warning */
.jp-TrimmedOutputs > a {
  margin: 10px;
  text-decoration: none;
  cursor: pointer;
}

.jp-TrimmedOutputs > a:hover {
  text-decoration: none;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Table of Contents
|----------------------------------------------------------------------------*/

:root {
  --jp-private-toc-active-width: 4px;
}

.jp-TableOfContents {
  display: flex;
  flex-direction: column;
  background: var(--jp-layout-color1);
  color: var(--jp-ui-font-color1);
  font-size: var(--jp-ui-font-size1);
  height: 100%;
}

.jp-TableOfContents-placeholder {
  text-align: center;
}

.jp-TableOfContents-placeholderContent {
  color: var(--jp-content-font-color2);
  padding: 8px;
}

.jp-TableOfContents-placeholderContent > h3 {
  margin-bottom: var(--jp-content-heading-margin-bottom);
}

.jp-TableOfContents .jp-SidePanel-content {
  overflow-y: auto;
}

.jp-TableOfContents-tree {
  margin: 4px;
}

.jp-TableOfContents ol {
  list-style-type: none;
}

/* stylelint-disable-next-line selector-max-type */
.jp-TableOfContents li > ol {
  /* Align left border with triangle icon center */
  padding-left: 11px;
}

.jp-TableOfContents-content {
  /* left margin for the active heading indicator */
  margin: 0 0 0 var(--jp-private-toc-active-width);
  padding: 0;
  background-color: var(--jp-layout-color1);
}

.jp-tocItem {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.jp-tocItem-heading {
  display: flex;
  cursor: pointer;
}

.jp-tocItem-heading:hover {
  background-color: var(--jp-layout-color2);
}

.jp-tocItem-content {
  display: block;
  padding: 4px 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden;
}

.jp-tocItem-collapser {
  height: 20px;
  margin: 2px 2px 0;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}

.jp-tocItem-collapser:hover {
  background-color: var(--jp-layout-color3);
}

/* Active heading indicator */

.jp-tocItem-heading::before {
  content: ' ';
  background: transparent;
  width: var(--jp-private-toc-active-width);
  height: 24px;
  position: absolute;
  left: 0;
  border-radius: var(--jp-border-radius);
}

.jp-tocItem-heading.jp-tocItem-active::before {
  background-color: var(--jp-brand-color1);
}

.jp-tocItem-heading:hover.jp-tocItem-active::before {
  background: var(--jp-brand-color0);
  opacity: 1;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

.jp-Collapser {
  flex: 0 0 var(--jp-cell-collapser-width);
  padding: 0;
  margin: 0;
  border: none;
  outline: none;
  background: transparent;
  border-radius: var(--jp-border-radius);
  opacity: 1;
}

.jp-Collapser-child {
  display: block;
  width: 100%;
  box-sizing: border-box;

  /* height: 100% doesn't work because the height of its parent is computed from content */
  position: absolute;
  top: 0;
  bottom: 0;
}

/*-----------------------------------------------------------------------------
| Printing
|----------------------------------------------------------------------------*/

/*
Hiding collapsers in print mode.

Note: input and output wrappers have "display: block" propery in print mode.
*/

@media print {
  .jp-Collapser {
    display: none;
  }
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Header/Footer
|----------------------------------------------------------------------------*/

/* Hidden by zero height by default */
.jp-CellHeader,
.jp-CellFooter {
  height: 0;
  width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  outline: none;
  background: transparent;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Input
|----------------------------------------------------------------------------*/

/* All input areas */
.jp-InputArea {
  display: table;
  table-layout: fixed;
  width: 100%;
  overflow: hidden;
}

.jp-InputArea-editor {
  display: table-cell;
  overflow: hidden;
  vertical-align: top;

  /* This is the non-active, default styling */
  border: var(--jp-border-width) solid var(--jp-cell-editor-border-color);
  border-radius: 0;
  background: var(--jp-cell-editor-background);
}

.jp-InputPrompt {
  display: table-cell;
  vertical-align: top;
  width: var(--jp-cell-prompt-width);
  color: var(--jp-cell-inprompt-font-color);
  font-family: var(--jp-cell-prompt-font-family);
  padding: var(--jp-code-padding);
  letter-spacing: var(--jp-cell-prompt-letter-spacing);
  opacity: var(--jp-cell-prompt-opacity);
  line-height: var(--jp-code-line-height);
  font-size: var(--jp-code-font-size);
  border: var(--jp-border-width) solid transparent;

  /* Right align prompt text, don't wrap to handle large prompt numbers */
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  /* Disable text selection */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/*-----------------------------------------------------------------------------
| Mobile
|----------------------------------------------------------------------------*/
@media only screen and (max-width: 760px) {
  .jp-InputArea-editor {
    display: table-row;
    margin-left: var(--jp-notebook-padding);
  }

  .jp-InputPrompt {
    display: table-row;
    text-align: left;
  }
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Placeholder
|----------------------------------------------------------------------------*/

.jp-Placeholder {
  display: table;
  table-layout: fixed;
  width: 100%;
}

.jp-Placeholder-prompt {
  display: table-cell;
  box-sizing: border-box;
}

.jp-Placeholder-content {
  display: table-cell;
  padding: 4px 6px;
  border: 1px solid transparent;
  border-radius: 0;
  background: none;
  box-sizing: border-box;
  cursor: pointer;
}

.jp-Placeholder-contentContainer {
  display: flex;
}

.jp-Placeholder-content:hover,
.jp-InputPlaceholder > .jp-Placeholder-content:hover {
  border-color: var(--jp-layout-color3);
}

.jp-Placeholder-content .jp-MoreHorizIcon {
  width: 32px;
  height: 16px;
  border: 1px solid transparent;
  border-radius: var(--jp-border-radius);
}

.jp-Placeholder-content .jp-MoreHorizIcon:hover {
  border: 1px solid var(--jp-border-color1);
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.25);
  background-color: var(--jp-layout-color0);
}

.jp-PlaceholderText {
  white-space: nowrap;
  overflow-x: hidden;
  color: var(--jp-inverse-layout-color3);
  font-family: var(--jp-code-font-family);
}

.jp-InputPlaceholder > .jp-Placeholder-content {
  border-color: var(--jp-cell-editor-border-color);
  background: var(--jp-cell-editor-background);
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Private CSS variables
|----------------------------------------------------------------------------*/

:root {
  --jp-private-cell-scrolling-output-offset: 5px;
}

/*-----------------------------------------------------------------------------
| Cell
|----------------------------------------------------------------------------*/

.jp-Cell {
  padding: var(--jp-cell-padding);
  margin: 0;
  border: none;
  outline: none;
  background: transparent;
}

/*-----------------------------------------------------------------------------
| Common input/output
|----------------------------------------------------------------------------*/

.jp-Cell-inputWrapper,
.jp-Cell-outputWrapper {
  display: flex;
  flex-direction: row;
  padding: 0;
  margin: 0;

  /* Added to reveal the box-shadow on the input and output collapsers. */
  overflow: visible;
}

/* Only input/output areas inside cells */
.jp-Cell-inputArea,
.jp-Cell-outputArea {
  flex: 1 1 auto;
}

/*-----------------------------------------------------------------------------
| Collapser
|----------------------------------------------------------------------------*/

/* Make the output collapser disappear when there is not output, but do so
 * in a manner that leaves it in the layout and preserves its width.
 */
.jp-Cell.jp-mod-noOutputs .jp-Cell-outputCollapser {
  border: none !important;
  background: transparent !important;
}

.jp-Cell:not(.jp-mod-noOutputs) .jp-Cell-outputCollapser {
  min-height: var(--jp-cell-collapser-min-height);
}

/*-----------------------------------------------------------------------------
| Output
|----------------------------------------------------------------------------*/

/* Put a space between input and output when there IS output */
.jp-Cell:not(.jp-mod-noOutputs) .jp-Cell-outputWrapper {
  margin-top: 5px;
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea {
  overflow-y: auto;
  max-height: 24em;
  margin-left: var(--jp-private-cell-scrolling-output-offset);
  resize: vertical;
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea[style*='height'] {
  max-height: unset;
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-Cell-outputArea::after {
  content: ' ';
  box-shadow: inset 0 0 6px 2px rgb(0 0 0 / 30%);
  width: 100%;
  height: 100%;
  position: sticky;
  bottom: 0;
  top: 0;
  margin-top: -50%;
  float: left;
  display: block;
  pointer-events: none;
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-OutputArea-child {
  padding-top: 6px;
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-OutputArea-prompt {
  width: calc(
    var(--jp-cell-prompt-width) - var(--jp-private-cell-scrolling-output-offset)
  );
}

.jp-CodeCell.jp-mod-outputsScrolled .jp-OutputArea-promptOverlay {
  left: calc(-1 * var(--jp-private-cell-scrolling-output-offset));
}

/*-----------------------------------------------------------------------------
| CodeCell
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| MarkdownCell
|----------------------------------------------------------------------------*/

.jp-MarkdownOutput {
  display: table-cell;
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: var(--jp-code-padding);
}

.jp-MarkdownOutput.jp-RenderedHTMLCommon {
  overflow: auto;
}

/* collapseHeadingButton (show always if hiddenCellsButton is _not_ shown) */
.jp-collapseHeadingButton {
  display: flex;
  min-height: var(--jp-cell-collapser-min-height);
  font-size: var(--jp-code-font-size);
  position: absolute;
  background-color: transparent;
  background-size: 25px;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: top;
  background-image: var(--jp-icon-caret-down);
  right: 0;
  top: 0;
  bottom: 0;
}

.jp-collapseHeadingButton.jp-mod-collapsed {
  background-image: var(--jp-icon-caret-right);
}

/*
 set the container font size to match that of content
 so that the nested collapse buttons have the right size
*/
.jp-MarkdownCell .jp-InputPrompt {
  font-size: var(--jp-content-font-size1);
}

/*
  Align collapseHeadingButton with cell top header
  The font sizes are identical to the ones in packages/rendermime/style/base.css
*/
.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='1'] {
  font-size: var(--jp-content-font-size5);
  background-position-y: calc(0.3 * var(--jp-content-font-size5));
}

.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='2'] {
  font-size: var(--jp-content-font-size4);
  background-position-y: calc(0.3 * var(--jp-content-font-size4));
}

.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='3'] {
  font-size: var(--jp-content-font-size3);
  background-position-y: calc(0.3 * var(--jp-content-font-size3));
}

.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='4'] {
  font-size: var(--jp-content-font-size2);
  background-position-y: calc(0.3 * var(--jp-content-font-size2));
}

.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='5'] {
  font-size: var(--jp-content-font-size1);
  background-position-y: top;
}

.jp-mod-rendered .jp-collapseHeadingButton[data-heading-level='6'] {
  font-size: var(--jp-content-font-size0);
  background-position-y: top;
}

/* collapseHeadingButton (show only on (hover,active) if hiddenCellsButton is shown) */
.jp-Notebook.jp-mod-showHiddenCellsButton .jp-collapseHeadingButton {
  display: none;
}

.jp-Notebook.jp-mod-showHiddenCellsButton
  :is(.jp-MarkdownCell:hover, .jp-mod-active)
  .jp-collapseHeadingButton {
  display: flex;
}

/* showHiddenCellsButton (only show if jp-mod-showHiddenCellsButton is set, which
is a consequence of the showHiddenCellsButton option in Notebook Settings)*/
.jp-Notebook.jp-mod-showHiddenCellsButton .jp-showHiddenCellsButton {
  margin-left: calc(var(--jp-cell-prompt-width) + 2 * var(--jp-code-padding));
  margin-top: var(--jp-code-padding);
  border: 1px solid var(--jp-border-color2);
  background-color: var(--jp-border-color3) !important;
  color: var(--jp-content-font-color0) !important;
  display: flex;
}

.jp-Notebook.jp-mod-showHiddenCellsButton .jp-showHiddenCellsButton:hover {
  background-color: var(--jp-border-color2) !important;
}

.jp-showHiddenCellsButton {
  display: none;
}

/*-----------------------------------------------------------------------------
| Printing
|----------------------------------------------------------------------------*/

/*
Using block instead of flex to allow the use of the break-inside CSS property for
cell outputs.
*/

@media print {
  .jp-Cell-inputWrapper,
  .jp-Cell-outputWrapper {
    display: block;
  }
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Variables
|----------------------------------------------------------------------------*/

:root {
  --jp-notebook-toolbar-padding: 2px 5px 2px 2px;
}

/*-----------------------------------------------------------------------------

/*-----------------------------------------------------------------------------
| Styles
|----------------------------------------------------------------------------*/

.jp-NotebookPanel-toolbar {
  padding: var(--jp-notebook-toolbar-padding);

  /* disable paint containment from lumino 2.0 default strict CSS containment */
  contain: style size !important;
}

.jp-Toolbar-item.jp-Notebook-toolbarCellType .jp-select-wrapper.jp-mod-focused {
  border: none;
  box-shadow: none;
}

.jp-Notebook-toolbarCellTypeDropdown select {
  height: 24px;
  font-size: var(--jp-ui-font-size1);
  line-height: 14px;
  border-radius: 0;
  display: block;
}

.jp-Notebook-toolbarCellTypeDropdown span {
  top: 5px !important;
}

.jp-Toolbar-responsive-popup {
  position: absolute;
  height: fit-content;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  border-bottom: var(--jp-border-width) solid var(--jp-toolbar-border-color);
  box-shadow: var(--jp-toolbar-box-shadow);
  background: var(--jp-toolbar-background);
  min-height: var(--jp-toolbar-micro-height);
  padding: var(--jp-notebook-toolbar-padding);
  z-index: 1;
  right: 0;
  top: 0;
}

.jp-Toolbar > .jp-Toolbar-responsive-opener {
  margin-left: auto;
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Variables
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------

/*-----------------------------------------------------------------------------
| Styles
|----------------------------------------------------------------------------*/

.jp-Notebook-ExecutionIndicator {
  position: relative;
  display: inline-block;
  height: 100%;
  z-index: 9997;
}

.jp-Notebook-ExecutionIndicator-tooltip {
  visibility: hidden;
  height: auto;
  width: max-content;
  width: -moz-max-content;
  background-color: var(--jp-layout-color2);
  color: var(--jp-ui-font-color1);
  text-align: justify;
  border-radius: 6px;
  padding: 0 5px;
  position: fixed;
  display: table;
}

.jp-Notebook-ExecutionIndicator-tooltip.up {
  transform: translateX(-50%) translateY(-100%) translateY(-32px);
}

.jp-Notebook-ExecutionIndicator-tooltip.down {
  transform: translateX(calc(-100% + 16px)) translateY(5px);
}

.jp-Notebook-ExecutionIndicator-tooltip.hidden {
  display: none;
}

.jp-Notebook-ExecutionIndicator:hover .jp-Notebook-ExecutionIndicator-tooltip {
  visibility: visible;
}

.jp-Notebook-ExecutionIndicator span {
  font-size: var(--jp-ui-font-size1);
  font-family: var(--jp-ui-font-family);
  color: var(--jp-ui-font-color1);
  line-height: 24px;
  display: block;
}

.jp-Notebook-ExecutionIndicator-progress-bar {
  display: flex;
  justify-content: center;
  height: 100%;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

/*
 * Execution indicator
 */
.jp-tocItem-content::after {
  content: '';

  /* Must be identical to form a circle */
  width: 12px;
  height: 12px;
  background: none;
  border: none;
  position: absolute;
  right: 0;
}

.jp-tocItem-content[data-running='0']::after {
  border-radius: 50%;
  border: var(--jp-border-width) solid var(--jp-inverse-layout-color3);
  background: none;
}

.jp-tocItem-content[data-running='1']::after {
  border-radius: 50%;
  border: var(--jp-border-width) solid var(--jp-inverse-layout-color3);
  background-color: var(--jp-inverse-layout-color3);
}

.jp-tocItem-content[data-running='0'],
.jp-tocItem-content[data-running='1'] {
  margin-right: 12px;
}

/*
 * Copyright (c) Jupyter Development Team.
 * Distributed under the terms of the Modified BSD License.
 */

.jp-Notebook-footer {
  height: 27px;
  margin-left: calc(
    var(--jp-cell-prompt-width) + var(--jp-cell-collapser-width) +
      var(--jp-cell-padding)
  );
  width: calc(
    100% -
      (
        var(--jp-cell-prompt-width) + var(--jp-cell-collapser-width) +
          var(--jp-cell-padding) + var(--jp-cell-padding)
      )
  );
  border: var(--jp-border-width) solid var(--jp-cell-editor-border-color);
  color: var(--jp-ui-font-color3);
  margin-top: 6px;
  background: none;
  cursor: pointer;
}

.jp-Notebook-footer:focus {
  border-color: var(--jp-cell-editor-active-border-color);
}

/* For devices that support hovering, hide footer until hover */
@media (hover: hover) {
  .jp-Notebook-footer {
    opacity: 0;
  }

  .jp-Notebook-footer:focus,
  .jp-Notebook-footer:hover {
    opacity: 1;
  }
}

/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| Imports
|----------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------
| CSS variables
|----------------------------------------------------------------------------*/

:root {
  --jp-side-by-side-output-size: 1fr;
  --jp-side-by-side-resized-cell: var(--jp-side-by-side-output-size);
  --jp-private-notebook-dragImage-width: 304px;
  --jp-private-notebook-dragImage-height: 36px;
  --jp-private-notebook-selected-color: var(--md-blue-400);
  --jp-private-notebook-active-color: var(--md-green-400);
}

/*-----------------------------------------------------------------------------
| Notebook
|----------------------------------------------------------------------------*/

/* stylelint-disable selector-max-class */

.jp-NotebookPanel {
  display: block;
  height: 100%;
}

.jp-NotebookPanel.jp-Document {
  min-width: 240px;
  min-height: 120px;
}

.jp-Notebook {
  padding: var(--jp-notebook-padding);
  outline: none;
  overflow: auto;
  background: var(--jp-layout-color0);
}

.jp-Notebook.jp-mod-scrollPastEnd::after {
  display: block;
  content: '';
  min-height: var(--jp-notebook-scroll-padding);
}

.jp-MainAreaWidget-ContainStrict .jp-Notebook * {
  contain: strict;
}

.jp-Notebook .jp-Cell {
  overflow: visible;
}

.jp-Notebook .jp-Cell .jp-InputPrompt {
  cursor: move;
}

/*-----------------------------------------------------------------------------
| Notebook state related styling
|
| The notebook and cells each have states, here are the possibilities:
|
| - Notebook
|   - Command
|   - Edit
| - Cell
|   - None
|   - Active (only one can be active)
|   - Selected (the cells actions are applied to)
|   - Multiselected (when multiple selected, the cursor)
|   - No outputs
|----------------------------------------------------------------------------*/

/* Command or edit modes */

.jp-Notebook .jp-Cell:not(.jp-mod-active) .jp-InputPrompt {
  opacity: var(--jp-cell-prompt-not-active-opacity);
  color: var(--jp-cell-prompt-not-active-font-color);
}

.jp-Notebook .jp-Cell:not(.jp-mod-active) .jp-OutputPrompt {
  opacity: var(--jp-cell-prompt-not-active-opacity);
  color: var(--jp-cell-prompt-not-active-font-color);
}

/* cell is active */
.jp-Notebook .jp-Cell.jp-mod-active .jp-Collapser {
  background: var(--jp-brand-color1);
}

/* cell is dirty */
.jp-Notebook .jp-Cell.jp-mod-dirty .jp-InputPrompt {
  color: var(--jp-warn-color1);
}

.jp-Notebook .jp-Cell.jp-mod-dirty .jp-InputPrompt::before {
  color: var(--jp-warn-color1);
  content: '•';
}

.jp-Notebook .jp-Cell.jp-mod-active.jp-mod-dirty .jp-Collapser {
  background: var(--jp-warn-color1);
}

/* collapser is hovered */
.jp-Notebook .jp-Cell .jp-Collapser:hover {
  box-shadow: var(--jp-elevation-z2);
  background: var(--jp-brand-color1);
  opacity: var(--jp-cell-collapser-not-active-hover-opacity);
}

/* cell is active and collapser is hovered */
.jp-Notebook .jp-Cell.jp-mod-active .jp-Collapser:hover {
  background: var(--jp-brand-color0);
  opacity: 1;
}

/* Command mode */

.jp-Notebook.jp-mod-commandMode .jp-Cell.jp-mod-selected {
  background: var(--jp-notebook-multiselected-color);
}

.jp-Notebook.jp-mod-commandMode
  .jp-Cell.jp-mod-active.jp-mod-selected:not(.jp-mod-multiSelected) {
  background: transparent;
}

/* Edit mode */

.jp-Notebook.jp-mod-editMode .jp-Cell.jp-mod-active .jp-InputArea-editor {
  border: var(--jp-border-width) solid var(--jp-cell-editor-active-border-color);
  box-shadow: var(--jp-input-box-shadow);
  background-color: var(--jp-cell-editor-active-background);
}

/*-----------------------------------------------------------------------------
| Notebook drag and drop
|----------------------------------------------------------------------------*/

.jp-Notebook-cell.jp-mod-dropSource {
  opacity: 0.5;
}

.jp-Notebook-cell.jp-mod-dropTarget,
.jp-Notebook.jp-mod-commandMode
  .jp-Notebook-cell.jp-mod-active.jp-mod-selected.jp-mod-dropTarget {
  border-top-color: var(--jp-private-notebook-selected-color);
  border-top-style: solid;
  border-top-width: 2px;
}

.jp-dragImage {
  display: block;
  flex-direction: row;
  width: var(--jp-private-notebook-dragImage-width);
  height: var(--jp-private-notebook-dragImage-height);
  border: var(--jp-border-width) solid var(--jp-cell-editor-border-color);
  background: var(--jp-cell-editor-background);
  overflow: visible;
}

.jp-dragImage-singlePrompt {
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.12);
}

.jp-dragImage .jp-dragImage-content {
  flex: 1 1 auto;
  z-index: 2;
  font-size: var(--jp-code-font-size);
  font-family: var(--jp-code-font-family);
  line-height: var(--jp-code-line-height);
  padding: var(--jp-code-padding);
  border: var(--jp-border-width) solid var(--jp-cell-editor-border-color);
  background: var(--jp-cell-editor-background-color);
  color: var(--jp-content-font-color3);
  text-align: left;
  margin: 4px 4px 4px 0;
}

.jp-dragImage .jp-dragImage-prompt {
  flex: 0 0 auto;
  min-width: 36px;
  color: var(--jp-cell-inprompt-font-color);
  padding: var(--jp-code-padding);
  padding-left: 12px;
  font-family: var(--jp-cell-prompt-font-family);
  letter-spacing: var(--jp-cell-prompt-letter-spacing);
  line-height: 1.9;
  font-size: var(--jp-code-font-size);
  border: var(--jp-border-width) solid transparent;
}

.jp-dragImage-multipleBack {
  z-index: -1;
  position: absolute;
  height: 32px;
  width: 300px;
  top: 8px;
  left: 8px;
  background: var(--jp-layout-color2);
  border: var(--jp-border-width) solid var(--jp-input-border-color);
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.12);
}

/*-----------------------------------------------------------------------------
| Cell toolbar
|----------------------------------------------------------------------------*/

.jp-NotebookTools {
  display: block;
  min-width: var(--jp-sidebar-min-width);
  color: var(--jp-ui-font-color1);
  background: var(--jp-layout-color1);

  /* This is needed so that all font sizing of children done in ems is
    * relative to this base size */
  font-size: var(--jp-ui-font-size1);
  overflow: auto;
}

.jp-ActiveCellTool {
  padding: 12px 0;
  display: flex;
}

.jp-ActiveCellTool-Content {
  flex: 1 1 auto;
}

.jp-ActiveCellTool .jp-ActiveCellTool-CellContent {
  background: var(--jp-cell-editor-background);
  border: var(--jp-border-width) solid var(--jp-cell-editor-border-color);
  border-radius: 0;
  min-height: 29px;
}

.jp-ActiveCellTool .jp-InputPrompt {
  min-width: calc(var(--jp-cell-prompt-width) * 0.75);
}

.jp-ActiveCellTool-CellContent > pre {
  padding: 5px 4px;
  margin: 0;
  white-space: normal;
}

.jp-MetadataEditorTool {
  flex-direction: column;
  padding: 12px 0;
}

.jp-RankedPanel > :not(:first-child) {
  margin-top: 12px;
}

.jp-KeySelector select.jp-mod-styled {
  font-size: var(--jp-ui-font-size1);
  color: var(--jp-ui-font-color0);
  border: var(--jp-border-width) solid var(--jp-border-color1);
}

.jp-KeySelector label,
.jp-MetadataEditorTool label,
.jp-NumberSetter label {
  line-height: 1.4;
}

.jp-NotebookTools .jp-select-wrapper {
  margin-top: 4px;
  margin-bottom: 0;
}

.jp-NumberSetter input {
  width: 100%;
  margin-top: 4px;
}

.jp-NotebookTools .jp-Collapse {
  margin-top: 16px;
}

/*-----------------------------------------------------------------------------
| Presentation Mode (.jp-mod-presentationMode)
|----------------------------------------------------------------------------*/

.jp-mod-presentationMode .jp-Notebook {
  --jp-content-font-size1: var(--jp-content-presentation-font-size1);
  --jp-code-font-size: var(--jp-code-presentation-font-size);
}

.jp-mod-presentationMode .jp-Notebook .jp-Cell .jp-InputPrompt,
.jp-mod-presentationMode .jp-Notebook .jp-Cell .jp-OutputPrompt {
  flex: 0 0 110px;
}

/*-----------------------------------------------------------------------------
| Side-by-side Mode (.jp-mod-sideBySide)
|----------------------------------------------------------------------------*/
.jp-mod-sideBySide.jp-Notebook .jp-Notebook-cell {
  margin-top: 3em;
  margin-bottom: 3em;
  margin-left: 5%;
  margin-right: 5%;
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) min-content minmax(
      0,
      var(--jp-side-by-side-output-size)
    );
  grid-template-rows: auto minmax(0, 1fr) auto;
  grid-template-areas:
    'header header header'
    'input handle output'
    'footer footer footer';
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell.jp-mod-resizedCell {
  grid-template-columns: minmax(0, 1fr) min-content minmax(
      0,
      var(--jp-side-by-side-resized-cell)
    );
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell .jp-CellHeader {
  grid-area: header;
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell .jp-Cell-inputWrapper {
  grid-area: input;
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell .jp-Cell-outputWrapper {
  /* overwrite the default margin (no vertical separation needed in side by side move */
  margin-top: 0;
  grid-area: output;
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell .jp-CellFooter {
  grid-area: footer;
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell .jp-CellResizeHandle {
  grid-area: handle;
  user-select: none;
  display: block;
  height: 100%;
  cursor: ew-resize;
  padding: 0 var(--jp-cell-padding);
}

.jp-mod-sideBySide.jp-Notebook .jp-CodeCell .jp-CellResizeHandle::after {
  content: '';
  display: block;
  background: var(--jp-border-color2);
  height: 100%;
  width: 5px;
}

.jp-mod-sideBySide.jp-Notebook
  .jp-CodeCell.jp-mod-resizedCell
  .jp-CellResizeHandle::after {
  background: var(--jp-border-color0);
}

.jp-CellResizeHandle {
  display: none;
}

/*-----------------------------------------------------------------------------
| Placeholder
|----------------------------------------------------------------------------*/

.jp-Cell-Placeholder {
  padding-left: 55px;
}

.jp-Cell-Placeholder-wrapper {
  background: #fff;
  border: 1px solid;
  border-color: #e5e6e9 #dfe0e4 #d0d1d5;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  margin: 10px 15px;
}

.jp-Cell-Placeholder-wrapper-inner {
  padding: 15px;
  position: relative;
}

.jp-Cell-Placeholder-wrapper-body {
  background-repeat: repeat;
  background-size: 50% auto;
}

.jp-Cell-Placeholder-wrapper-body div {
  background: #f6f7f8;
  background-image: -webkit-linear-gradient(
    left,
    #f6f7f8 0%,
    #edeef1 20%,
    #f6f7f8 40%,
    #f6f7f8 100%
  );
  background-repeat: no-repeat;
  background-size: 800px 104px;
  height: 104px;
  position: absolute;
  right: 15px;
  left: 15px;
  top: 15px;
}

div.jp-Cell-Placeholder-h1 {
  top: 20px;
  height: 20px;
  left: 15px;
  width: 150px;
}

div.jp-Cell-Placeholder-h2 {
  left: 15px;
  top: 50px;
  height: 10px;
  width: 100px;
}

div.jp-Cell-Placeholder-content-1,
div.jp-Cell-Placeholder-content-2,
div.jp-Cell-Placeholder-content-3 {
  left: 15px;
  right: 15px;
  height: 10px;
}

div.jp-Cell-Placeholder-content-1 {
  top: 100px;
}

div.jp-Cell-Placeholder-content-2 {
  top: 120px;
}

div.jp-Cell-Placeholder-content-3 {
  top: 140px;
}

</style>
<style type="text/css">
/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/

/*
The following CSS variables define the main, public API for styling JupyterLab.
These variables should be used by all plugins wherever possible. In other
words, plugins should not define custom colors, sizes, etc unless absolutely
necessary. This enables users to change the visual theme of JupyterLab
by changing these variables.

Many variables appear in an ordered sequence (0,1,2,3). These sequences
are designed to work well together, so for example, `--jp-border-color1` should
be used with `--jp-layout-color1`. The numbers have the following meanings:

* 0: super-primary, reserved for special emphasis
* 1: primary, most important under normal situations
* 2: secondary, next most important under normal situations
* 3: tertiary, next most important under normal situations

Throughout JupyterLab, we are mostly following principles from Google's
Material Design when selecting colors. We are not, however, following
all of MD as it is not optimized for dense, information rich UIs.
*/

:root {
  /* Elevation
   *
   * We style box-shadows using Material Design's idea of elevation. These particular numbers are taken from here:
   *
   * https://github.com/material-components/material-components-web
   * https://material-components-web.appspot.com/elevation.html
   */

  --jp-shadow-base-lightness: 0;
  --jp-shadow-umbra-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.2
  );
  --jp-shadow-penumbra-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.14
  );
  --jp-shadow-ambient-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.12
  );
  --jp-elevation-z0: none;
  --jp-elevation-z1: 0 2px 1px -1px var(--jp-shadow-umbra-color),
    0 1px 1px 0 var(--jp-shadow-penumbra-color),
    0 1px 3px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z2: 0 3px 1px -2px var(--jp-shadow-umbra-color),
    0 2px 2px 0 var(--jp-shadow-penumbra-color),
    0 1px 5px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z4: 0 2px 4px -1px var(--jp-shadow-umbra-color),
    0 4px 5px 0 var(--jp-shadow-penumbra-color),
    0 1px 10px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z6: 0 3px 5px -1px var(--jp-shadow-umbra-color),
    0 6px 10px 0 var(--jp-shadow-penumbra-color),
    0 1px 18px 0 var(--jp-shadow-ambient-color);
  --jp-elevation-z8: 0 5px 5px -3px var(--jp-shadow-umbra-color),
    0 8px 10px 1px var(--jp-shadow-penumbra-color),
    0 3px 14px 2px var(--jp-shadow-ambient-color);
  --jp-elevation-z12: 0 7px 8px -4px var(--jp-shadow-umbra-color),
    0 12px 17px 2px var(--jp-shadow-penumbra-color),
    0 5px 22px 4px var(--jp-shadow-ambient-color);
  --jp-elevation-z16: 0 8px 10px -5px var(--jp-shadow-umbra-color),
    0 16px 24px 2px var(--jp-shadow-penumbra-color),
    0 6px 30px 5px var(--jp-shadow-ambient-color);
  --jp-elevation-z20: 0 10px 13px -6px var(--jp-shadow-umbra-color),
    0 20px 31px 3px var(--jp-shadow-penumbra-color),
    0 8px 38px 7px var(--jp-shadow-ambient-color);
  --jp-elevation-z24: 0 11px 15px -7px var(--jp-shadow-umbra-color),
    0 24px 38px 3px var(--jp-shadow-penumbra-color),
    0 9px 46px 8px var(--jp-shadow-ambient-color);

  /* Borders
   *
   * The following variables, specify the visual styling of borders in JupyterLab.
   */

  --jp-border-width: 1px;
  --jp-border-color0: var(--md-grey-400);
  --jp-border-color1: var(--md-grey-400);
  --jp-border-color2: var(--md-grey-300);
  --jp-border-color3: var(--md-grey-200);
  --jp-inverse-border-color: var(--md-grey-600);
  --jp-border-radius: 2px;

  /* UI Fonts
   *
   * The UI font CSS variables are used for the typography all of the JupyterLab
   * user interface elements that are not directly user generated content.
   *
   * The font sizing here is done assuming that the body font size of --jp-ui-font-size1
   * is applied to a parent element. When children elements, such as headings, are sized
   * in em all things will be computed relative to that body size.
   */

  --jp-ui-font-scale-factor: 1.2;
  --jp-ui-font-size0: 0.83333em;
  --jp-ui-font-size1: 13px; /* Base font size */
  --jp-ui-font-size2: 1.2em;
  --jp-ui-font-size3: 1.44em;
  --jp-ui-font-family: system-ui, -apple-system, blinkmacsystemfont, 'Segoe UI',
    helvetica, arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
    'Segoe UI Symbol';

  /*
   * Use these font colors against the corresponding main layout colors.
   * In a light theme, these go from dark to light.
   */

  /* Defaults use Material Design specification */
  --jp-ui-font-color0: rgba(0, 0, 0, 1);
  --jp-ui-font-color1: rgba(0, 0, 0, 0.87);
  --jp-ui-font-color2: rgba(0, 0, 0, 0.54);
  --jp-ui-font-color3: rgba(0, 0, 0, 0.38);

  /*
   * Use these against the brand/accent/warn/error colors.
   * These will typically go from light to darker, in both a dark and light theme.
   */

  --jp-ui-inverse-font-color0: rgba(255, 255, 255, 1);
  --jp-ui-inverse-font-color1: rgba(255, 255, 255, 1);
  --jp-ui-inverse-font-color2: rgba(255, 255, 255, 0.7);
  --jp-ui-inverse-font-color3: rgba(255, 255, 255, 0.5);

  /* Content Fonts
   *
   * Content font variables are used for typography of user generated content.
   *
   * The font sizing here is done assuming that the body font size of --jp-content-font-size1
   * is applied to a parent element. When children elements, such as headings, are sized
   * in em all things will be computed relative to that body size.
   */

  --jp-content-line-height: 1.6;
  --jp-content-font-scale-factor: 1.2;
  --jp-content-font-size0: 0.83333em;
  --jp-content-font-size1: 14px; /* Base font size */
  --jp-content-font-size2: 1.2em;
  --jp-content-font-size3: 1.44em;
  --jp-content-font-size4: 1.728em;
  --jp-content-font-size5: 2.0736em;

  /* This gives a magnification of about 125% in presentation mode over normal. */
  --jp-content-presentation-font-size1: 17px;
  --jp-content-heading-line-height: 1;
  --jp-content-heading-margin-top: 1.2em;
  --jp-content-heading-margin-bottom: 0.8em;
  --jp-content-heading-font-weight: 500;

  /* Defaults use Material Design specification */
  --jp-content-font-color0: rgba(0, 0, 0, 1);
  --jp-content-font-color1: rgba(0, 0, 0, 0.87);
  --jp-content-font-color2: rgba(0, 0, 0, 0.54);
  --jp-content-font-color3: rgba(0, 0, 0, 0.38);
  --jp-content-link-color: var(--md-blue-900);
  --jp-content-font-family: system-ui, -apple-system, blinkmacsystemfont,
    'Segoe UI', helvetica, arial, sans-serif, 'Apple Color Emoji',
    'Segoe UI Emoji', 'Segoe UI Symbol';

  /*
   * Code Fonts
   *
   * Code font variables are used for typography of code and other monospaces content.
   */

  --jp-code-font-size: 13px;
  --jp-code-line-height: 1.3077; /* 17px for 13px base */
  --jp-code-padding: 5px; /* 5px for 13px base, codemirror highlighting needs integer px value */
  --jp-code-font-family-default: menlo, consolas, 'DejaVu Sans Mono', monospace;
  --jp-code-font-family: var(--jp-code-font-family-default);

  /* This gives a magnification of about 125% in presentation mode over normal. */
  --jp-code-presentation-font-size: 16px;

  /* may need to tweak cursor width if you change font size */
  --jp-code-cursor-width0: 1.4px;
  --jp-code-cursor-width1: 2px;
  --jp-code-cursor-width2: 4px;

  /* Layout
   *
   * The following are the main layout colors use in JupyterLab. In a light
   * theme these would go from light to dark.
   */

  --jp-layout-color0: white;
  --jp-layout-color1: white;
  --jp-layout-color2: var(--md-grey-200);
  --jp-layout-color3: var(--md-grey-400);
  --jp-layout-color4: var(--md-grey-600);

  /* Inverse Layout
   *
   * The following are the inverse layout colors use in JupyterLab. In a light
   * theme these would go from dark to light.
   */

  --jp-inverse-layout-color0: #111;
  --jp-inverse-layout-color1: var(--md-grey-900);
  --jp-inverse-layout-color2: var(--md-grey-800);
  --jp-inverse-layout-color3: var(--md-grey-700);
  --jp-inverse-layout-color4: var(--md-grey-600);

  /* Brand/accent */

  --jp-brand-color0: var(--md-blue-900);
  --jp-brand-color1: var(--md-blue-700);
  --jp-brand-color2: var(--md-blue-300);
  --jp-brand-color3: var(--md-blue-100);
  --jp-brand-color4: var(--md-blue-50);
  --jp-accent-color0: var(--md-green-900);
  --jp-accent-color1: var(--md-green-700);
  --jp-accent-color2: var(--md-green-300);
  --jp-accent-color3: var(--md-green-100);

  /* State colors (warn, error, success, info) */

  --jp-warn-color0: var(--md-orange-900);
  --jp-warn-color1: var(--md-orange-700);
  --jp-warn-color2: var(--md-orange-300);
  --jp-warn-color3: var(--md-orange-100);
  --jp-error-color0: var(--md-red-900);
  --jp-error-color1: var(--md-red-700);
  --jp-error-color2: var(--md-red-300);
  --jp-error-color3: var(--md-red-100);
  --jp-success-color0: var(--md-green-900);
  --jp-success-color1: var(--md-green-700);
  --jp-success-color2: var(--md-green-300);
  --jp-success-color3: var(--md-green-100);
  --jp-info-color0: var(--md-cyan-900);
  --jp-info-color1: var(--md-cyan-700);
  --jp-info-color2: var(--md-cyan-300);
  --jp-info-color3: var(--md-cyan-100);

  /* Cell specific styles */

  --jp-cell-padding: 5px;
  --jp-cell-collapser-width: 8px;
  --jp-cell-collapser-min-height: 20px;
  --jp-cell-collapser-not-active-hover-opacity: 0.6;
  --jp-cell-editor-background: var(--md-grey-100);
  --jp-cell-editor-border-color: var(--md-grey-300);
  --jp-cell-editor-box-shadow: inset 0 0 2px var(--md-blue-300);
  --jp-cell-editor-active-background: var(--jp-layout-color0);
  --jp-cell-editor-active-border-color: var(--jp-brand-color1);
  --jp-cell-prompt-width: 64px;
  --jp-cell-prompt-font-family: var(--jp-code-font-family-default);
  --jp-cell-prompt-letter-spacing: 0;
  --jp-cell-prompt-opacity: 1;
  --jp-cell-prompt-not-active-opacity: 0.5;
  --jp-cell-prompt-not-active-font-color: var(--md-grey-700);

  /* A custom blend of MD grey and blue 600
   * See https://meyerweb.com/eric/tools/color-blend/#546E7A:1E88E5:5:hex */
  --jp-cell-inprompt-font-color: #307fc1;

  /* A custom blend of MD grey and orange 600
   * https://meyerweb.com/eric/tools/color-blend/#546E7A:F4511E:5:hex */
  --jp-cell-outprompt-font-color: #bf5b3d;

  /* Notebook specific styles */

  --jp-notebook-padding: 10px;
  --jp-notebook-select-background: var(--jp-layout-color1);
  --jp-notebook-multiselected-color: var(--md-blue-50);

  /* The scroll padding is calculated to fill enough space at the bottom of the
  notebook to show one single-line cell (with appropriate padding) at the top
  when the notebook is scrolled all the way to the bottom. We also subtract one
  pixel so that no scrollbar appears if we have just one single-line cell in the
  notebook. This padding is to enable a 'scroll past end' feature in a notebook.
  */
  --jp-notebook-scroll-padding: calc(
    100% - var(--jp-code-font-size) * var(--jp-code-line-height) -
      var(--jp-code-padding) - var(--jp-cell-padding) - 1px
  );

  /* Rendermime styles */

  --jp-rendermime-error-background: #fdd;
  --jp-rendermime-table-row-background: var(--md-grey-100);
  --jp-rendermime-table-row-hover-background: var(--md-light-blue-50);

  /* Dialog specific styles */

  --jp-dialog-background: rgba(0, 0, 0, 0.25);

  /* Console specific styles */

  --jp-console-padding: 10px;

  /* Toolbar specific styles */

  --jp-toolbar-border-color: var(--jp-border-color1);
  --jp-toolbar-micro-height: 8px;
  --jp-toolbar-background: var(--jp-layout-color1);
  --jp-toolbar-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.24);
  --jp-toolbar-header-margin: 4px 4px 0 4px;
  --jp-toolbar-active-background: var(--md-grey-300);

  /* Statusbar specific styles */

  --jp-statusbar-height: 24px;

  /* Input field styles */

  --jp-input-box-shadow: inset 0 0 2px var(--md-blue-300);
  --jp-input-active-background: var(--jp-layout-color1);
  --jp-input-hover-background: var(--jp-layout-color1);
  --jp-input-background: var(--md-grey-100);
  --jp-input-border-color: var(--jp-inverse-border-color);
  --jp-input-active-border-color: var(--jp-brand-color1);
  --jp-input-active-box-shadow-color: rgba(19, 124, 189, 0.3);

  /* General editor styles */

  --jp-editor-selected-background: #d9d9d9;
  --jp-editor-selected-focused-background: #d7d4f0;
  --jp-editor-cursor-color: var(--jp-ui-font-color0);

  /* Code mirror specific styles */

  --jp-mirror-editor-keyword-color: #008000;
  --jp-mirror-editor-atom-color: #88f;
  --jp-mirror-editor-number-color: #080;
  --jp-mirror-editor-def-color: #00f;
  --jp-mirror-editor-variable-color: var(--md-grey-900);
  --jp-mirror-editor-variable-2-color: rgb(0, 54, 109);
  --jp-mirror-editor-variable-3-color: #085;
  --jp-mirror-editor-punctuation-color: #05a;
  --jp-mirror-editor-property-color: #05a;
  --jp-mirror-editor-operator-color: #a2f;
  --jp-mirror-editor-comment-color: #408080;
  --jp-mirror-editor-string-color: #ba2121;
  --jp-mirror-editor-string-2-color: #708;
  --jp-mirror-editor-meta-color: #a2f;
  --jp-mirror-editor-qualifier-color: #555;
  --jp-mirror-editor-builtin-color: #008000;
  --jp-mirror-editor-bracket-color: #997;
  --jp-mirror-editor-tag-color: #170;
  --jp-mirror-editor-attribute-color: #00c;
  --jp-mirror-editor-header-color: blue;
  --jp-mirror-editor-quote-color: #090;
  --jp-mirror-editor-link-color: #00c;
  --jp-mirror-editor-error-color: #f00;
  --jp-mirror-editor-hr-color: #999;

  /*
    RTC user specific colors.
    These colors are used for the cursor, username in the editor,
    and the icon of the user.
  */

  --jp-collaborator-color1: #ffad8e;
  --jp-collaborator-color2: #dac83d;
  --jp-collaborator-color3: #72dd76;
  --jp-collaborator-color4: #00e4d0;
  --jp-collaborator-color5: #45d4ff;
  --jp-collaborator-color6: #e2b1ff;
  --jp-collaborator-color7: #ff9de6;

  /* Vega extension styles */

  --jp-vega-background: white;

  /* Sidebar-related styles */

  --jp-sidebar-min-width: 250px;

  /* Search-related styles */

  --jp-search-toggle-off-opacity: 0.5;
  --jp-search-toggle-hover-opacity: 0.8;
  --jp-search-toggle-on-opacity: 1;
  --jp-search-selected-match-background-color: rgb(245, 200, 0);
  --jp-search-selected-match-color: black;
  --jp-search-unselected-match-background-color: var(
    --jp-inverse-layout-color0
  );
  --jp-search-unselected-match-color: var(--jp-ui-inverse-font-color0);

  /* Icon colors that work well with light or dark backgrounds */
  --jp-icon-contrast-color0: var(--md-purple-600);
  --jp-icon-contrast-color1: var(--md-green-600);
  --jp-icon-contrast-color2: var(--md-pink-600);
  --jp-icon-contrast-color3: var(--md-blue-600);

  /* Button colors */
  --jp-accept-color-normal: var(--md-blue-700);
  --jp-accept-color-hover: var(--md-blue-800);
  --jp-accept-color-active: var(--md-blue-900);
  --jp-warn-color-normal: var(--md-red-700);
  --jp-warn-color-hover: var(--md-red-800);
  --jp-warn-color-active: var(--md-red-900);
  --jp-reject-color-normal: var(--md-grey-600);
  --jp-reject-color-hover: var(--md-grey-700);
  --jp-reject-color-active: var(--md-grey-800);

  /* File or activity icons and switch semantic variables */
  --jp-jupyter-icon-color: #f37626;
  --jp-notebook-icon-color: #f37626;
  --jp-json-icon-color: var(--md-orange-700);
  --jp-console-icon-background-color: var(--md-blue-700);
  --jp-console-icon-color: white;
  --jp-terminal-icon-background-color: var(--md-grey-800);
  --jp-terminal-icon-color: var(--md-grey-200);
  --jp-text-editor-icon-color: var(--md-grey-700);
  --jp-inspector-icon-color: var(--md-grey-700);
  --jp-switch-color: var(--md-grey-400);
  --jp-switch-true-position-color: var(--md-orange-900);
}
</style>
<style type="text/css">
/* Force rendering true colors when outputing to pdf */
* {
  -webkit-print-color-adjust: exact;
}

/* Misc */
a.anchor-link {
  display: none;
}

/* Input area styling */
.jp-InputArea {
  overflow: hidden;
}

.jp-InputArea-editor {
  overflow: hidden;
}

.cm-editor.cm-s-jupyter .highlight pre {
/* weird, but --jp-code-padding defined to be 5px but 4px horizontal padding is hardcoded for pre.cm-line */
  padding: var(--jp-code-padding) 4px;
  margin: 0;

  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;

}

.jp-OutputArea-output pre {
  line-height: inherit;
  font-family: inherit;
}

.jp-RenderedText pre {
  color: var(--jp-content-font-color1);
  font-size: var(--jp-code-font-size);
}

/* Hiding the collapser by default */
.jp-Collapser {
  display: none;
}

@page {
    margin: 0.5in; /* Margin for each printed piece of paper */
}

@media print {
  .jp-Cell-inputWrapper,
  .jp-Cell-outputWrapper {
    display: block;
  }
}
</style>
<!-- Load mathjax -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-AMS_CHTML-full,Safe"> </script>
<!-- MathJax configuration -->
<script type="text/x-mathjax-config">
    init_mathjax = function() {
        if (window.MathJax) {
        // MathJax loaded
            MathJax.Hub.Config({
                TeX: {
                    equationNumbers: {
                    autoNumber: "AMS",
                    useLabelIds: true
                    }
                },
                tex2jax: {
                    inlineMath: [ ['$','$'], ["\\(","\\)"] ],
                    displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
                    processEscapes: true,
                    processEnvironments: true
                },
                displayAlign: 'center',
                CommonHTML: {
                    linebreaks: {
                    automatic: true
                    }
                }
            });

            MathJax.Hub.Queue(["Typeset", MathJax.Hub]);
        }
    }
    init_mathjax();
    </script>
<!-- End of mathjax configuration --><script type="module">
  document.addEventListener("DOMContentLoaded", async () => {
    const diagrams = document.querySelectorAll(".jp-Mermaid > pre.mermaid");
    // do not load mermaidjs if not needed
    if (!diagrams.length) {
      return;
    }
    const mermaid = (await import("https://cdnjs.cloudflare.com/ajax/libs/mermaid/10.6.0/mermaid.esm.min.mjs")).default;
    const parser = new DOMParser();

    mermaid.initialize({
      maxTextSize: 100000,
      startOnLoad: false,
      fontFamily: window
        .getComputedStyle(document.body)
        .getPropertyValue("--jp-ui-font-family"),
      theme: document.querySelector("body[data-jp-theme-light='true']")
        ? "default"
        : "dark",
    });

    let _nextMermaidId = 0;

    function makeMermaidImage(svg) {
      const img = document.createElement("img");
      const doc = parser.parseFromString(svg, "image/svg+xml");
      const svgEl = doc.querySelector("svg");
      const { maxWidth } = svgEl?.style || {};
      const firstTitle = doc.querySelector("title");
      const firstDesc = doc.querySelector("desc");

      img.setAttribute("src", `data:image/svg+xml,${encodeURIComponent(svg)}`);
      if (maxWidth) {
        img.width = parseInt(maxWidth);
      }
      if (firstTitle) {
        img.setAttribute("alt", firstTitle.textContent);
      }
      if (firstDesc) {
        const caption = document.createElement("figcaption");
        caption.className = "sr-only";
        caption.textContent = firstDesc.textContent;
        return [img, caption];
      }
      return [img];
    }

    async function makeMermaidError(text) {
      let errorMessage = "";
      try {
        await mermaid.parse(text);
      } catch (err) {
        errorMessage = `${err}`;
      }

      const result = document.createElement("details");
      result.className = 'jp-RenderedMermaid-Details';
      const summary = document.createElement("summary");
      summary.className = 'jp-RenderedMermaid-Summary';
      const pre = document.createElement("pre");
      const code = document.createElement("code");
      code.innerText = text;
      pre.appendChild(code);
      summary.appendChild(pre);
      result.appendChild(summary);

      const warning = document.createElement("pre");
      warning.innerText = errorMessage;
      result.appendChild(warning);
      return [result];
    }

    async function renderOneMarmaid(src) {
      const id = `jp-mermaid-${_nextMermaidId++}`;
      const parent = src.parentNode;
      let raw = src.textContent.trim();
      const el = document.createElement("div");
      el.style.visibility = "hidden";
      document.body.appendChild(el);
      let results = null;
      let output = null;
      try {
        const { svg } = await mermaid.render(id, raw, el);
        results = makeMermaidImage(svg);
        output = document.createElement("figure");
        results.map(output.appendChild, output);
      } catch (err) {
        parent.classList.add("jp-mod-warning");
        results = await makeMermaidError(raw);
        output = results[0];
      } finally {
        el.remove();
      }
      parent.classList.add("jp-RenderedMermaid");
      parent.appendChild(output);
    }

    void Promise.all([...diagrams].map(renderOneMarmaid));
  });
</script>
<style>
  .jp-Mermaid:not(.jp-RenderedMermaid) {
    display: none;
  }

  .jp-RenderedMermaid {
    overflow: auto;
    display: flex;
  }

  .jp-RenderedMermaid.jp-mod-warning {
    width: auto;
    padding: 0.5em;
    margin-top: 0.5em;
    border: var(--jp-border-width) solid var(--jp-warn-color2);
    border-radius: var(--jp-border-radius);
    color: var(--jp-ui-font-color1);
    font-size: var(--jp-ui-font-size1);
    white-space: pre-wrap;
    word-wrap: break-word;
  }

  .jp-RenderedMermaid figure {
    margin: 0;
    overflow: auto;
    max-width: 100%;
  }

  .jp-RenderedMermaid img {
    max-width: 100%;
  }

  .jp-RenderedMermaid-Details > pre {
    margin-top: 1em;
  }

  .jp-RenderedMermaid-Summary {
    color: var(--jp-warn-color2);
  }

  .jp-RenderedMermaid:not(.jp-mod-warning) pre {
    display: none;
  }

  .jp-RenderedMermaid-Summary > pre {
    display: inline-block;
    white-space: normal;
  }
</style>
<!-- End of mermaid configuration --></head>
<body class="jp-Notebook" data-jp-theme-light="true" data-jp-theme-name="JupyterLab Light">
<main><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=ba9654a9-8255-498b-bd72-70b02f1a316a">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [73]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="kn">import</span> <span class="nn">requests</span>
<span class="kn">import</span> <span class="nn">pandas</span> <span class="k">as</span> <span class="nn">pd</span>
<span class="kn">from</span> <span class="nn">bs4</span> <span class="kn">import</span>   <span class="n">BeautifulSoup</span>
<span class="n">ur1</span><span class="o">=</span><span class="s1">'http://kan.znds.com/movie/'</span>
<span class="n">header</span><span class="o">=</span><span class="p">{</span><span class="s2">"User-Agent"</span><span class="p">:</span><span class="s2">"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36 Edg/123.0.0.0"</span><span class="p">}</span>
<span class="n">path</span><span class="o">=</span><span class="s2">"C:/Users/Administrator/Desktop/first.xlsx"</span>
<span class="sd">'''</span>
<span class="sd">两个参数</span>
<span class="sd">:param url:统一资源定位符,请求网址</span>
<span class="sd">:param headers:请求头</span>
<span class="sd">:return:html</span>
<span class="sd">'''</span>
    
<span class="c1"># ***************** Begin ******************** #</span>
<span class="c1"># get请求网页</span>
<span class="n">response</span> <span class="o">=</span> <span class="n">requests</span><span class="o">.</span><span class="n">get</span><span class="p">(</span><span class="n">ur1</span><span class="p">,</span> <span class="n">headers</span><span class="o">=</span><span class="n">header</span><span class="p">)</span>
<span class="n">response</span><span class="o">.</span><span class="n">encoding</span> <span class="o">=</span> <span class="s2">"utf-8"</span>
<span class="c1"># 获取网页信息文本</span>
<span class="n">a</span> <span class="o">=</span> <span class="n">response</span><span class="o">.</span><span class="n">text</span>
<span class="n">soup</span><span class="o">=</span><span class="n">BeautifulSoup</span><span class="p">(</span><span class="n">a</span><span class="p">,</span><span class="s1">'lxml'</span><span class="p">)</span>  
<span class="nb">print</span><span class="p">(</span><span class="n">soup</span><span class="p">)</span>
<span class="n">name</span><span class="o">=</span><span class="p">[]</span>
<span class="n">name1</span><span class="o">=</span><span class="p">[]</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;meta charset="utf-8"/&gt;
&lt;meta content="IE=edge" http-equiv="X-UA-Compatible"/&gt;
&lt;meta href="" rel="Shortcut Icon"/&gt;
&lt;meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"/&gt;
&lt;title&gt;电影大全_好看的电影_最新好看的电影_电影排行榜-影视快搜&lt;/title&gt;
&lt;meta content="电影大全,好看的电影,电影排行榜,最新电影" name="keywords"/&gt;
&lt;meta content="影视快搜电影频道-提供最新电影,好看的电影,最新电影排行榜,涵盖喜剧片、科幻片、战争片、武侠片、爱情动作片、等电影大全在线观看或下载,精细分类让您发现好看的电影大片。" name="description"/&gt;
&lt;link href="/public/home/css/bootstrap.min.css" rel="stylesheet" type="text/css"/&gt;
&lt;link href="/public/home/css/swiper.min.css" rel="stylesheet" type="text/css"/&gt;
&lt;link href="/public/home/css/main.css?v=5" rel="stylesheet" type="text/css"/&gt;
&lt;link href="/public/home/css/varity.css?v=2" rel="stylesheet" type="text/css"/&gt;
&lt;link href="/public/home/images/favicon.ico" rel="shortcut icon" type="image/x-icon"/&gt;
&lt;script src="http://jt.dangbei.net/js/kan/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="http://jt.dangbei.net/js/kan/bootstrap.min.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script&gt;var APP ='';var MODULE ="/home";var CONTROLLER ='/home/movie';&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;script type="text/javascript"&gt;function browserRedirect() {var sUserAgent =navigator.userAgent.toLowerCase();var bIsIpad =sUserAgent.match(/ipad/i) =="ipad";var bIsIphoneOs =sUserAgent.match(/iphone os/i) =="iphone os";var bIsMidp =sUserAgent.match(/midp/i) =="midp";var bIsUc7 =sUserAgent.match(/rv:1.2.3.4/i) =="rv:1.2.3.4";var bIsUc =sUserAgent.match(/ucweb/i) =="ucweb";var bIsAndroid =sUserAgent.match(/android/i) =="android";var bIsCE =sUserAgent.match(/windows ce/i) =="windows ce";var bIsWM =sUserAgent.match(/windows mobile/i) =="windows mobile";if (bIsIpad ||bIsIphoneOs ||bIsMidp ||bIsUc7 ||bIsUc ||bIsAndroid ||bIsCE ||bIsWM) {var current_url =window.location.href;current_url=current_url.toLowerCase();var pathname =window.location.pathname;var murl ='http://k.znds.com';if(pathname.length&gt;1){var servername =replaceAll(current_url,pathname,'');var url =replaceAll(current_url,servername,murl);}else{var url =murl;}
window.location =url;}
}
function replaceAll(str1,str2,str3){var k;var tmp =str1.split(str2);k=tmp[0];for(i=1;i&lt;tmp.length;i++){k+=str3+tmp[i];}
return k;}
	$('body').delegate('.column_laster li,.app_rank li','mouseover',function(){$(this).parent().find('.notActive').css('display','block');$(this).parent().find('.active').css('display','none');$(this).find('.notActive').hide();$(this).find('.active').show();})
	var search =function(){$('body').delegate('.search_input','click',function(){$('.search_select').toggle();})
$('body').delegate('.search_option','click',function(){var img =$(this).find('img').attr('src');var value =$(this).find('img').attr('value');if(img){$('.search_input img').attr('src',img);$('.search_select').hide();}
if(value){$('.search_box .search_input img').attr('value',value);var search =$(this).parent().parent().find('input[name="search"]').val();if(value.indexOf('sokan.znds.com').toString() &gt;=0){var num_q =value.indexOf('?q=');var num_s =value.indexOf('&amp;s=');var re_l =value.substring(0,num_q+3);var re_r =value.substring(num_s);var src =re_l+search+re_r;}else{var src =value+search;}
$('.search_box .search_button a').attr('href',src);}
})
};var choice_online =function(){$('body').delegate('.online_choice','click',function(){$('.online_option').toggle();})
$('body').delegate('.online_option li','click',function(){var value=$(this).html();var src =$(this).find('img').attr('value');$('.online_show a').attr('href',src);$('.online_choice').html(value);$('.online_option').hide();})
}
	function search_input(that){var search =$(that).val();var value =$('.search_box .search_input img').attr('value');if(value.indexOf('sokan.znds.com').toString() &gt;=0){var num_q =value.indexOf('?q=');var num_s =value.indexOf('&amp;s=');var re_l =value.substring(0,num_q+3);var re_r =value.substring(num_s);var src =re_l+search+re_r;}else{var src =value+search;}
$('.search_box .search_button a').attr('href',src);return src;};choice_online();search();browserRedirect();&lt;/script&gt;
&lt;nav&gt;
&lt;div class="w_1180"&gt;
&lt;div class="col-lg-3 col-md-3"&gt;
&lt;a href="/"&gt;
&lt;img height="50" src="/public/home/images/logo.png?ver=2"/&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div class="col-lg-5 col-md-5"&gt;
&lt;a href="http://www.dangbei.com/ysks/" rel="nofollow" target="_blank"&gt;
&lt;img height="60" src="https://jt5.dangbei.net/img/hqys/gg_480_60.jpg" width="100%"/&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div class="col-lg-4 col-md-4 search_box"&gt;
&lt;div class="search_film"&gt;
&lt;div class="search_input"&gt;&lt;img src="/public/home/images/ysks.png" value="http://kan.znds.com/search/?q="/&gt;&lt;/div&gt;
&lt;input name="search" onblur="search_input(this)" onkeydown="if(event.keyCode == 13){ var src = search_input(this);window.location.href = src;}" placeholder="输入影片" value=""/&gt;
&lt;div class="search_select"&gt;
&lt;div class="search_option"&gt;
&lt;img src="/public/home/images/ysks.png" value="http://kan.znds.com/search/?q="/&gt;
哈趣影视
&lt;/div&gt;
&lt;div class="search_option"&gt;
&lt;img src="/public/home/images/baidu.png" value="http://sokan.znds.com/cse/search?q=&amp;amp;s=17224655456261987621&amp;amp;nsid=0"/&gt;
百度一下
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;span class="search_button"&gt;
&lt;a href="http://kan.znds.com/search/?q="&gt;&lt;img src="/public/home/images/search.png"/&gt;&lt;/a&gt;
&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/nav&gt;
&lt;div class="nav_ul clearfix"&gt;
&lt;div class="w_1180"&gt;
&lt;ul class="col-lg-8 col-md-8 pull-left nav_head"&gt;
&lt;li&gt;&lt;a href="/"&gt;首页&lt;/a&gt;&lt;/li&gt;
&lt;li class="active"&gt;&lt;a href="/movie/"&gt;电影&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="/tv/"&gt;电视剧&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="/zongyi/"&gt;综艺&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="/dongman/"&gt;动漫&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="/shaoer/"&gt;少儿&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="/zt/"&gt;专题&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="col-lg-4 col-md-4 pull-right nav_ks"&gt;
&lt;a href="http://www.dangbei.com/ysks/" target="_blank"&gt;哈趣影视下载&lt;/a&gt;
&lt;a href="http://www.znds.com/" target="_blank"&gt;智能电视网&lt;/a&gt;
&lt;a href="http://down.znds.com/" target="_blank"&gt;当贝市场&lt;/a&gt;
&lt;a class="commonNav_btn" href="javascript:;"&gt;
&lt;i class="glyphicon glyphicon-th-list"&gt;&lt;/i&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div id="commonNav"&gt;&lt;/div&gt;
&lt;div class="main ccn" style="text-align: center;overflow: hidden;"&gt;
&lt;script&gt;(function() {var s ="_" + Math.random().toString(36).slice(2);document.write('&lt;div id="' + s + '"&gt;&lt;/div&gt;');(window.slotbydup=window.slotbydup ||[]).push({id:'5041780',container:s,size:'1180,60',display:'inlay-fix'
});})();&lt;/script&gt;
&lt;script src="https://www.znds.com/api.php?mod=js&amp;amp;bid=393" type="text/javascript"&gt;&lt;/script&gt;
&lt;/div&gt;
&lt;script&gt;$('.main.ccn').children('div').remove();var img =new Image();img.src =$('.main.ccn  img:first').attr('src');img.onload =function () {var naturalWidth =img.naturalWidth;var naturalHeight =img.naturalHeight;console.log(naturalHeight);if(naturalHeight ==1){$('.main').remove();}
}
&lt;/script&gt;
&lt;section class="nav_section clearfix w_1180"&gt;
&lt;h3&gt;&lt;a href="//kan.znds.com/" style="margin-top:0;"&gt;哈趣影视&lt;/a&gt; &amp;gt; &lt;a href="//kan.znds.com/movie/"&gt;电影&lt;/a&gt;&lt;/h3&gt;
&lt;div class="col-lg-1 col-md-1"&gt;按类型:&lt;/div&gt;
&lt;ul class="col-lg-11 col-md-11"&gt;
&lt;li class="active"&gt;
&lt;a href="/movie/"&gt;全部&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;a href="/movie/cat_xiju_year_all_area_all/"&gt;喜剧&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_aiqing_year_all_area_all/"&gt;爱情&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_dongzuo_year_all_area_all/"&gt;动作&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_kongbu_year_all_area_all/"&gt;恐怖&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_kehuan_year_all_area_all/"&gt;科幻&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_juqing_year_all_area_all/"&gt;剧情&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_maoxian_year_all_area_all/"&gt;冒险&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_fanzui_year_all_area_all/"&gt;犯罪&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_qihuan_year_all_area_all/"&gt;奇幻&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_zhanzheng_year_all_area_all/"&gt;战争&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_xuanyi_year_all_area_all/"&gt;悬疑&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_donghua_year_all_area_all/"&gt;动画&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_wenyi_year_all_area_all/"&gt;文艺&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_lunli_year_all_area_all/"&gt;伦理&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_jilu_year_all_area_all/"&gt;纪录&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_zhuanji_year_all_area_all/"&gt;传记&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_guzhuang_year_all_area_all/"&gt;古装&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_wuxia_year_all_area_all/"&gt;武侠&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_lishi_year_all_area_all/"&gt;历史&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_jingsong_year_all_area_all/"&gt;惊悚&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/cat_qi-ta_year_all_area_all/"&gt;其它&lt;/a&gt;
&lt;/li&gt;&lt;/ul&gt;
&lt;div class="col-lg-1 col-md-1"&gt;按地区:&lt;/div&gt;
&lt;ul class="col-lg-11 col-md-11"&gt;
&lt;li class="active"&gt;
&lt;a href="/movie/"&gt;全部&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;a href="/movie/area_zhongguo_year_all_cat_all/"&gt;中国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_meiguo_year_all_cat_all/"&gt;美国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_xianggan_year_all_cat_all/"&gt;中国香港&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_hanguo_year_all_cat_all/"&gt;韩国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_riben_year_all_cat_all/"&gt;日本&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_faguo_year_all_cat_all/"&gt;法国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_yingguo_year_all_cat_all/"&gt;英国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_deguo_year_all_cat_all/"&gt;德国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_taiguo_year_all_cat_all/"&gt;泰国&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_yindu_year_all_cat_all/"&gt;印度&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/area_qita_year_all_cat_all/"&gt;其他&lt;/a&gt;
&lt;/li&gt;&lt;/ul&gt;
&lt;div class="col-lg-1 col-md-1"&gt;按年代:&lt;/div&gt;
&lt;ul class="col-lg-11 col-md-11"&gt;
&lt;li class="active"&gt;
&lt;a href="/movie/"&gt;全部&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;a href="/movie/year_2023_area_all_cat_all/"&gt;2023&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2022_area_all_cat_all/"&gt;2022&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2021_area_all_cat_all/"&gt;2021&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2020_area_all_cat_all/"&gt;2020&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2019_area_all_cat_all/"&gt;2019&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2018_area_all_cat_all/"&gt;2018&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2017_area_all_cat_all/"&gt;2017&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2016_area_all_cat_all/"&gt;2016&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2015_area_all_cat_all/"&gt;2015&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2014_area_all_cat_all/"&gt;2014&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2013_area_all_cat_all/"&gt;2013&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2012_area_all_cat_all/"&gt;2012&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2011_area_all_cat_all/"&gt;2011&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_2010_area_all_cat_all/"&gt;2010&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_00_area_all_cat_all/"&gt;00年代（2000-2009）&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_90_area_all_cat_all/"&gt;90年代（1990-1999）&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_80_area_all_cat_all/"&gt;80年代（1980-1989）&lt;/a&gt;
&lt;/li&gt;&lt;li&gt;
&lt;a href="/movie/year_70_area_all_cat_all/"&gt;更早（1979之前）&lt;/a&gt;
&lt;/li&gt;&lt;/ul&gt; &lt;/section&gt;
&lt;section class="w_1180"&gt;
&lt;div&gt;&lt;a href="http://www.dangbei.com/ysks/" target="_blank"&gt;&lt;img src="/public/home/images/yy.jpg?v=1"/&gt;&lt;/a&gt;&lt;/div&gt;
&lt;/section&gt;
&lt;section class="clearfix w_1180"&gt;
&lt;div class="film_box"&gt;
&lt;a href="/v/4618007.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="太极之异兽冢" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/e9/4618007.jpg!300" title="太极之异兽冢"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
太极之异兽冢 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/8170.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="阿凡达" class="lst_item_img" src="http://imgsou.dangbei.com/images/yy/20190109/5c357219d9a56.jpg!300" title="阿凡达"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
阿凡达 &lt;/p&gt;
&lt;div class="sorce"&gt;
9.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/510564.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="美女与野兽" class="lst_item_img" src="http://imgsou.dangbei.com/images/yy/20190409/5cabf98457621.jpg!300" title="美女与野兽"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
美女与野兽 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.5分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/6259065.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="东北猛兽" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/2d/6259065.jpg!300" title="东北猛兽"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
东北猛兽 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.9分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/8296307.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="养蜂人" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/ea/8296307.jpg!300" title="养蜂人"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
养蜂人 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.9分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/3451764.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="奇门密探" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/25/3451764.jpg!300" title="奇门密探"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
奇门密探 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/2393798.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="天下无毒" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/96/2393798.jpg!300" title="天下无毒"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
天下无毒 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.0分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/6188516.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="追龙番外篇之龙争虎斗" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/40/6188516.jpg!300" title="追龙番外篇之龙争虎斗"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
追龙番外篇之龙争虎斗 &lt;/p&gt;
&lt;div class="sorce"&gt;
9.1分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/2362043.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="扫黑·决战" class="lst_item_img" src="http://imgsou.dangbei.com/images/yy/20210529/60b19e5dc4202.jpg!300" title="扫黑·决战"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
扫黑·决战 &lt;/p&gt;
&lt;div class="sorce"&gt;
9.0分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/879164.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="济公之英雄归位" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/65/879164.jpg!300" title="济公之英雄归位"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
济公之英雄归位 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.7分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/2137653.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="2019阅兵盛典" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/29/2137653.jpg!300" title="2019阅兵盛典"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
2019阅兵盛典 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.7分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/6200026.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="狙击之王：暗杀" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/50/6200026.jpg!300" title="狙击之王：暗杀"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
狙击之王：暗杀 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.5分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/8795105.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="妖神令" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/c7/8795105.jpg!300" title="妖神令"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
妖神令 &lt;/p&gt;
&lt;div class="sorce"&gt;
6.9分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/6251871.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="幻术先生" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/02/6251871.jpg!300" title="幻术先生"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
幻术先生 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.6分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/5659088.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="生死排爆" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/45/5659088.jpg!300" title="生死排爆"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
生死排爆 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.6分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/2426579.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="《你好，李焕英》“这是什么样的家庭啊”版预告" class="lst_item_img" src="http://imgsou.dangbei.com/images/yy/20201228/5fe98075d2d59.jpg!300" title="《你好，李焕英》“这是什么样的家庭啊”版预告"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
《你好，李焕英》“这是什么样的家庭啊”版预告 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/370074.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="刑警兄弟" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/f0/370074.jpg!300" title="刑警兄弟"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
刑警兄弟 &lt;/p&gt;
&lt;div class="sorce"&gt;
9.0分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/7910432.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="临时劫案" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/2d/7910432.jpg!300" title="临时劫案"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
临时劫案 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/113789.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="大搜查" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/e6/113789.jpg!300" title="大搜查"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
大搜查 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.6分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/5618346.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="难忘的战斗" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/37/5618346.jpg!300" title="难忘的战斗"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
难忘的战斗 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/2443466.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="反毒风暴" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/4e/2443466.jpg!300" title="反毒风暴"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
反毒风暴 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.4分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/8784664.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="十三太保之风云再起" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/4e/8784664.jpg!300" title="十三太保之风云再起"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
十三太保之风云再起 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.7分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/747492.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="杀破狼2" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/db/747492.jpg!300" title="杀破狼2"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
杀破狼2 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.9分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/106807.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="五月天追梦3DNA" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/41/106807.jpg!300" title="五月天追梦3DNA"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
五月天追梦3DNA &lt;/p&gt;
&lt;div class="sorce"&gt;
7.1分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/7963184.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="饥饿游戏：鸣鸟与蛇之歌" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/b0/7963184.jpg!300" title="饥饿游戏：鸣鸟与蛇之歌"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
饥饿游戏：鸣鸟与蛇之歌 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.7分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/143123.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="别问我是谁" class="lst_item_img" src="http://imgsou.dangbei.com/images/yy/20211231/61cee5fc8e907.jpg!300" title="别问我是谁"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
别问我是谁 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.3分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/3946561.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="上海夜行2危险游戏" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/5f/3946561.jpg!300" title="上海夜行2危险游戏"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
上海夜行2危险游戏 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.5分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/5618242.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="高山下的花环" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/d2/5618242.jpg!300" title="高山下的花环"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
高山下的花环 &lt;/p&gt;
&lt;div class="sorce"&gt;
9.4分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/940458.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="狂暴巨兽" class="lst_item_img" src="http://imgsou.dangbei.com/images/20180713/5b480115dea3c.jpg!300" title="狂暴巨兽"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
狂暴巨兽 &lt;/p&gt;
&lt;div class="sorce"&gt;
8.7分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;&lt;div class="film_box"&gt;
&lt;a href="/v/2360930.html" target="_blank"&gt;
&lt;div class="lst_item_img_box"&gt;
&lt;div class="mask"&gt;&lt;/div&gt;
&lt;img alt="凤唳九天之焰赤篇" class="lst_item_img" src="http://imgsou.dangbei.com/images/20000/a9/2360930.jpg!300" title="凤唳九天之焰赤篇"/&gt; &lt;/div&gt;
&lt;p class="text-center"&gt;
凤唳九天之焰赤篇 &lt;/p&gt;
&lt;div class="sorce"&gt;
7.9分
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt; &lt;/section&gt;
&lt;section class="page w_1180"&gt;&lt;ul&gt; &lt;li class="active"&gt;&lt;a class="num" href="/movie/p_1"&gt;1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_2"&gt;2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_3"&gt;3&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_4"&gt;4&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_5"&gt;5&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_6"&gt;6&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_7"&gt;7&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_8"&gt;8&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_9"&gt;9&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_10"&gt;10&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a class="num" href="/movie/p_11"&gt;11&lt;/a&gt;&lt;/li&gt; ... &lt;li&gt;&lt;a class="num" href="/movie/p_2564"&gt;2564&lt;/a&gt;&lt;/li&gt; &lt;a class="next" href="/movie/p_2"&gt;&amp;gt;&lt;/a&gt;&lt;/ul&gt;&lt;/section&gt;
&lt;script src="http://jt.dangbei.net/js/commonNav/commonNav.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;div class="copyright"&gt;
&lt;div id="cpzs"&gt;&lt;/div&gt;
&lt;script src="https://jt.dangbei.net/js/db/kan_link.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;createlinks('#cpzs');&lt;/script&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="http://kan.znds.com/copyright.html" target="_blank"&gt;联系我们&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://kan.znds.com/copyright.html" target="_blank"&gt;知识产权保护声明&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://down.znds.com/apk/vod/2015/0429/2211.html" target="_blank"&gt;客户端下载&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.dangbei.com" target="_blank"&gt;当贝市场&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=32011402011373" rel="nofollow" style="color: #999;" target="_blank"&gt;苏公网安备 32011402011373号&lt;/a&gt; &lt;a href="https://beian.miit.gov.cn" rel="nofollow" style="color: #999" target="_blank"&gt;苏ICP备2023012627号-4&lt;/a&gt; Copyright © 2013-2024 kan.znds.com All rights reserved.
&lt;span&gt;投诉建议：tousu@znds.com&lt;/span&gt;
&lt;/div&gt;
&lt;script&gt;(function(){$('.commonNav_btn').mouseover(function(){$('#commonNav').addClass('active');})
$('.commonNav_btn').mouseout(function(){$('#commonNav').removeClass('active');})
$('#commonNav').mouseover(function(){$('#commonNav').addClass('active');})
$('#commonNav').mouseout(function(){$('#commonNav').removeClass('active');})
})()
createCommonNav('#commonNav');&lt;/script&gt;
&lt;div style="display:none"&gt;
&lt;script language="JavaScript" src="http://s11.cnzz.com/stat.php?id=1255248839&amp;amp;web_id=1255248839"&gt;&lt;/script&gt;
&lt;script language="JavaScript" src="http://s11.cnzz.com/stat.php?id=5025253&amp;amp;web_id=5025253"&gt;&lt;/script&gt;
&lt;script language="JavaScript" src="https://s6.cnzz.com/z_stat.php?id=2451183&amp;amp;web_id=2451183"&gt;&lt;/script&gt;
&lt;script&gt;var _hmt =_hmt ||[];(function() {var hm =document.createElement("script");hm.src ="https://hm.baidu.com/hm.js?5dd2140b9e3051f6de57edbb8ad24f9c";var s =document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm,s);})();&lt;/script&gt;
&lt;script&gt;var _hmt =_hmt ||[];(function() {var hm =document.createElement("script");hm.src ="https://hm.baidu.com/hm.js?12951a3a1863d688683c4e1be4a36229";var s =document.getElementsByTagName("script")[0];s.parentNode.insertBefore(hm,s);})();&lt;/script&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=2e2da074-681e-447e-ae1d-6228e986c715">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [74]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="n">soup3</span><span class="o">=</span><span class="n">soup</span><span class="o">.</span><span class="n">select</span><span class="p">(</span><span class="s1">'div[class="sorce"]'</span><span class="p">)</span>
<span class="k">for</span> <span class="n">soup4</span> <span class="ow">in</span> <span class="n">soup3</span><span class="p">:</span>
    <span class="n">name1</span><span class="o">.</span><span class="n">append</span><span class="p">(</span><span class="n">soup4</span><span class="o">.</span><span class="n">text</span><span class="p">)</span>
<span class="nb">print</span><span class="p">(</span><span class="n">name1</span><span class="p">)</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>['\n7.3分\n', '\n9.3分\n', '\n8.5分\n', '\n8.9分\n', '\n7.9分\n', '\n8.3分\n', '\n8.0分\n', '\n9.1分\n', '\n9.0分\n', '\n7.7分\n', '\n8.7分\n', '\n7.5分\n', '\n6.9分\n', '\n8.6分\n', '\n8.6分\n', '\n8.3分\n', '\n9.0分\n', '\n7.3分\n', '\n7.6分\n', '\n7.3分\n', '\n7.4分\n', '\n8.7分\n', '\n8.9分\n', '\n7.1分\n', '\n7.7分\n', '\n7.3分\n', '\n7.5分\n', '\n9.4分\n', '\n8.7分\n', '\n7.9分\n']
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=ab080e84-878d-4234-a316-5cecf90de63b">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [75]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="n">soup1</span><span class="o">=</span><span class="n">soup</span><span class="o">.</span><span class="n">find_all</span><span class="p">(</span><span class="s1">'p'</span><span class="p">)</span>
<span class="k">for</span> <span class="n">soup2</span> <span class="ow">in</span> <span class="n">soup</span><span class="p">(</span><span class="s1">'p'</span><span class="p">):</span>
    <span class="nb">print</span><span class="p">(</span><span class="n">soup2</span><span class="o">.</span><span class="n">text</span><span class="p">)</span>
    <span class="n">name</span><span class="o">.</span><span class="n">append</span><span class="p">(</span><span class="n">soup2</span><span class="o">.</span><span class="n">text</span><span class="p">)</span>
<span class="nb">print</span><span class="p">(</span><span class="n">name</span><span class="p">)</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>
太极之异兽冢 

阿凡达 

美女与野兽 

东北猛兽 

养蜂人 

奇门密探 

天下无毒 

追龙番外篇之龙争虎斗 

扫黑·决战 

济公之英雄归位 

2019阅兵盛典 

狙击之王：暗杀 

妖神令 

幻术先生 

生死排爆 

《你好，李焕英》“这是什么样的家庭啊”版预告 

刑警兄弟 

临时劫案 

大搜查 

难忘的战斗 

反毒风暴 

十三太保之风云再起 

杀破狼2 

五月天追梦3DNA 

饥饿游戏：鸣鸟与蛇之歌 

别问我是谁 

上海夜行2危险游戏 

高山下的花环 

狂暴巨兽 

凤唳九天之焰赤篇 
['\n太极之异兽冢 ', '\n阿凡达 ', '\n美女与野兽 ', '\n东北猛兽 ', '\n养蜂人 ', '\n奇门密探 ', '\n天下无毒 ', '\n追龙番外篇之龙争虎斗 ', '\n扫黑·决战 ', '\n济公之英雄归位 ', '\n2019阅兵盛典 ', '\n狙击之王：暗杀 ', '\n妖神令 ', '\n幻术先生 ', '\n生死排爆 ', '\n《你好，李焕英》“这是什么样的家庭啊”版预告 ', '\n刑警兄弟 ', '\n临时劫案 ', '\n大搜查 ', '\n难忘的战斗 ', '\n反毒风暴 ', '\n十三太保之风云再起 ', '\n杀破狼2 ', '\n五月天追梦3DNA ', '\n饥饿游戏：鸣鸟与蛇之歌 ', '\n别问我是谁 ', '\n上海夜行2危险游戏 ', '\n高山下的花环 ', '\n狂暴巨兽 ', '\n凤唳九天之焰赤篇 ']
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=f7bd66bb-97a3-4e69-afb9-affa11ef1223">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [84]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="n">da</span><span class="o">=</span><span class="n">pd</span><span class="o">.</span><span class="n">DataFrame</span><span class="p">({</span><span class="s1">'title'</span><span class="p">:</span><span class="n">name</span><span class="p">})</span>
<span class="n">pa</span><span class="o">=</span><span class="n">pd</span><span class="o">.</span><span class="n">DataFrame</span><span class="p">({</span><span class="s1">'title'</span><span class="p">:</span><span class="n">name1</span><span class="p">})</span>
<span class="nb">print</span><span class="p">(</span><span class="n">name1</span><span class="p">)</span>
<span class="n">writer</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">ExcelWriter</span><span class="p">(</span><span class="s1">'once.xlsx'</span><span class="p">)</span>
<span class="n">da</span><span class="o">.</span><span class="n">to_excel</span><span class="p">(</span><span class="n">writer</span><span class="p">,</span><span class="n">sheet_name</span><span class="o">=</span><span class="s1">'tb1'</span><span class="p">,</span> <span class="n">index</span><span class="o">=</span><span class="kc">False</span><span class="p">)</span>
<span class="n">pa</span><span class="o">.</span><span class="n">to_excel</span><span class="p">(</span><span class="n">writer</span><span class="p">,</span><span class="n">sheet_name</span><span class="o">=</span><span class="s1">'tb2'</span><span class="p">,</span> <span class="n">index</span><span class="o">=</span><span class="kc">False</span><span class="p">)</span>
<span class="n">writer</span><span class="o">.</span><span class="n">_save</span><span class="p">()</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>['\n7.3分\n', '\n9.3分\n', '\n8.5分\n', '\n8.9分\n', '\n7.9分\n', '\n8.3分\n', '\n8.0分\n', '\n9.1分\n', '\n9.0分\n', '\n7.7分\n', '\n8.7分\n', '\n7.5分\n', '\n6.9分\n', '\n8.6分\n', '\n8.6分\n', '\n8.3分\n', '\n9.0分\n', '\n7.3分\n', '\n7.6分\n', '\n7.3分\n', '\n7.4分\n', '\n8.7分\n', '\n8.9分\n', '\n7.1分\n', '\n7.7分\n', '\n7.3分\n', '\n7.5分\n', '\n9.4分\n', '\n8.7分\n', '\n7.9分\n']
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=a983affb-0f60-457b-80f5-06cf6fbce19d">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [86]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="kn">import</span> <span class="nn">requests</span>
<span class="kn">import</span> <span class="nn">pandas</span> <span class="k">as</span> <span class="nn">pd</span>
<span class="kn">from</span> <span class="nn">bs4</span> <span class="kn">import</span>   <span class="n">BeautifulSoup</span>
<span class="n">ur1</span><span class="o">=</span><span class="s1">'https://www.boc.cn/'</span>
<span class="n">header</span><span class="o">=</span><span class="p">{</span><span class="s2">"User-Agent"</span><span class="p">:</span><span class="s2">"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Safari/537.36 Edg/123.0.0.0"</span><span class="p">}</span>
<span class="sd">'''</span>
<span class="sd">两个参数</span>
<span class="sd">:param url:统一资源定位符,请求网址</span>
<span class="sd">:param headers:请求头</span>
<span class="sd">:return:html</span>
<span class="sd">'''</span>
    
<span class="c1"># ***************** Begin ******************** #</span>
<span class="c1"># get请求网页</span>
<span class="n">response</span> <span class="o">=</span> <span class="n">requests</span><span class="o">.</span><span class="n">get</span><span class="p">(</span><span class="n">ur1</span><span class="p">,</span> <span class="n">headers</span><span class="o">=</span><span class="n">header</span><span class="p">)</span>
<span class="n">response</span><span class="o">.</span><span class="n">encoding</span> <span class="o">=</span> <span class="s2">"utf-8"</span>
<span class="c1"># 获取网页信息文本</span>
<span class="n">a</span> <span class="o">=</span> <span class="n">response</span><span class="o">.</span><span class="n">text</span>
<span class="n">soup</span><span class="o">=</span><span class="n">BeautifulSoup</span><span class="p">(</span><span class="n">a</span><span class="p">,</span><span class="s1">'lxml'</span><span class="p">)</span>  
<span class="nb">print</span><span class="p">(</span><span class="n">soup</span><span class="p">)</span>
<span class="n">name</span><span class="o">=</span><span class="p">[]</span>
<span class="n">name1</span><span class="o">=</span><span class="p">[]</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;base target="_blank"/&gt;
&lt;meta content="text/html; charset=utf-8" http-equiv="Content-Type"/&gt;
&lt;meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"/&gt;
&lt;title&gt;中国银行网站_全球门户首页&lt;/title&gt;
&lt;meta content="中国银行,中行,银行,金融,金融市场,外汇,理财,证券,基金,保险,投资,电子银行,网上银行,网银,手机银行,公司金融,跨境撮合,个人金融,出国金融,私人银行,银行卡,信用卡,飞机租赁,村镇银行,普惠金融,绿色金融,双奥银行" name="keywords"/&gt;
&lt;meta content="中国银行是中国国际化和多元化程度最高的银行，在中国内地及六十多个国家和地区为客户提供全面的金融服务。主要经营商业银行业务：公司金融、个人金融和金融市场业务，并通过附属机构开展投资银行、保险、直接投资、投资管理、基金管理和飞机租赁业务。" name="description"/&gt;
&lt;link href="./images/boc2013_reset.css" rel="stylesheet" type="text/css"/&gt;
&lt;link href="./images/boc2013_common.css" rel="stylesheet" type="text/css"/&gt;
&lt;link href="./images/boc2013_index.css" rel="stylesheet" type="text/css"/&gt;
&lt;!--[if lte IE 8]&gt;
&lt;link type="text/css" rel="stylesheet" href="./images/boc2013_iestyle.css"&gt;
&lt;![endif]--&gt;
&lt;style type="text/css"&gt;
.ft_a{text-align:left;margin-top:18px;}
.ft_a a{color:#d28f1e;display:inline-block;text-align:left;background:url() no-repeat right -98px;padding-right:14px;margin-right:10px;}
.bb .bb_l{padding:0px 40px 40px 0px;border-right:1px solid #dadada;float:left;height:150px;width:279px;}
.bb_l .tabs{padding:20px;width:279px;}
.bb_l .tabs .tab_nav{position:absolute;left:0;top:19px;}
.bb_l .tabs .tab_nav li{background:none;border-width:0 1px 0 0;margin:0;padding:0;}
.bb_l .tabs .tab_nav li a{background:none;padding:0 15px;font-size:16px;}
.bb_l .tabs .tab_nav li.selected a{color:#000;}
.bb_l .tabs .tab_nav li.last{border:0;}
.bb_l .tabs .tab_content{border:0;padding-top:46px;height:130px;}
.bb .bb_l{*width:298px;*display:inline;}
.bb .bb_l .more{_bottom:36px;*padding-right:0;*right:-6px;}
.attend .zxkf{width:28px;height:26px;background-position:0 -653px;}
.index_lg {
	background: rgb(255, 255, 255); padding: 18px 20px 0px; border-radius: 3px; top: 0px; width: 182px; height: 175px; right: 26px; position: absolute;
}
.index_lg a {
	font: 13px/normal "微软雅黑"; margin: 0px auto; width: 162px; height: 26px; color: rgb(0, 0, 0); padding-bottom: 8px; padding-left: 22px; display: block; font-size-adjust: none; font-stretch: normal;
}
.map_area{width: 940px;padding-left: 38px;float: none;}
.map_area .zz1 ul li{width: 8%;margin: 0 9px;}
.zz2{margin: 0 45px 0 0;}
.phone span{padding-right: 10px;}
.header_info{width: 555px;margin-top: 46px;margin-right:11px;}
.msg1,.ca_fw{width: 285px;}
.scroller,.es-carousel_o,.es-carousel_o,.es-carousel{width: 885px;height: 135px;}
.es-carousel-wrapper{padding: 0;width: 885px;height: auto;}
.es-nav a{top: 44%;}
.bjfw{width: 71px;float: left;margin: 5px 8px;}
.es-carousel ul li a{margin: 0 auto;width: 49px;}
.es-carousel span{height: 28px;}
.es-carousel ul{display: block;position: absolute;top: 12px;left: 0;}
.picBox{margin: 15px auto 35px;}
.serves1 .con_l p span{padding-bottom: 5px;}
.bjfw_box{overflow: hidden;}
.bjfw_l{float: left;width: 78px;text-align: center;font: 20px "微软雅黑";border-right: 1px solid #dadada;height: 65px;color: #000;padding: 35px 0;}
.bjfw_r{float: left;width: 885px;padding-left: 10px;}
.qysh_box{position: relative;width: 262px;margin-left: 15px;height: 124px;}
.qysh_box img{display: block;}
.qysh_bg{width: 100%;position: absolute;left: 0;bottom: 0;height: 26px;opacity: 0.6;filter:alpha(opacity=60);-moz-opacity: 0.6;-khtml-opacity:0.6;background: #fff;}
.qysh_title{width: 255px;position: absolute;left: 7px;bottom: 0;line-height: 26px;height: 26px;}
.zz2 .hover_menu{height:115px;}
.top_menu p.p_2013, .phone, .footer_phone p{font-family:"宋体"}
&lt;/style&gt;
&lt;/head&gt;
&lt;body id="home"&gt;
&lt;div class="wrapper"&gt;
&lt;!--top--&gt;
&lt;!--top--&gt;
&lt;script src="https://pic.bankofchina.com/bocappd/images/boc2013_jquery-min.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script async="" charset="utf-8" defer="" id="ariascripts" loaddata="false" src="https://csv2.bankofchina.com/dist/aria.js?appid=f0d4a7cfca52bd27ee5dbb3fdd55756e" type="text/javascript" wapforceoldfixed="false"&gt;&lt;/script&gt;
&lt;div class="top clearfix"&gt;
&lt;div class="top_links"&gt;
&lt;a href="/index.html"&gt;简体中文&lt;/a&gt;
&lt;a href="/big5/index.html"&gt;繁体中文&lt;/a&gt;
&lt;a href="/en/index.html"&gt;English&lt;/a&gt;
&lt;a href="javascript:void(0)" onclick="aria.start()" target="_self"&gt;无障碍浏览&lt;/a&gt;
&lt;a href="javascript:void(0)" onclick="aria.oldFixedStart()" target="_self"&gt;适老版&lt;/a&gt;
&lt;/div&gt;
&lt;div class="top_menu"&gt;
&lt;p class="p_2013" style="background:none;"&gt;本网站支持IPv6&lt;/p&gt;
&lt;p class="p_2013" id="top_service"&gt;
&lt;a href="./custserv/cs1/201312/t20131230_2805579.html" title="全球服务"&gt;全球服务&lt;/a&gt;
&lt;/p&gt;
&lt;p class="p_2013" id="top_network"&gt;
&lt;a href="http://www.bankofchina.com/sourcedb/operations2021/" title="机构网点"&gt;机构网点&lt;/a&gt;
&lt;a class="top_zxkf" href="./custserv/cs1/201106/t20110610_2805580.html" title="在线客服"&gt;在线客服&lt;/a&gt;
&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--header--&gt;
&lt;div class="header"&gt;
&lt;div class="header_area"&gt;
&lt;h1 class="logo"&gt;&lt;a href="https://www.bankofchina.com/" title="中国银行"&gt;&lt;/a&gt;&lt;/h1&gt;
&lt;div class="header_info"&gt;
&lt;p class="phone"&gt;服务热线：&lt;span&gt;95566&lt;/span&gt;信用卡热线：&lt;span&gt;40066 95566&lt;/span&gt;&lt;/p&gt;
&lt;form action="https://srh.bankofchina.com/search/sitesearch/index.jsp" id="trssearchform" method="post" name="trssearchform" target="_blank"&gt;
&lt;input name="searchColumn" type="hidden" value="all"/&gt;
&lt;div class="search_bar"&gt;
&lt;input class="search_ipt" id="sword" name="sword" onblur="if(this.value == '') this.value='请输入检索关键词';" onfocus="if(this.value=='请输入检索关键词') this.value='';" type="text" value="请输入检索关键词"/&gt;
&lt;input class="search_btn" onclick="document.trssearchform.submit();" type="button"/&gt;
&lt;/div&gt;
&lt;/form&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--导航--&gt;
&lt;div class="nav_2013"&gt;
&lt;ul class="menu" id="BOC_NAVIGATOR_UL"&gt;
&lt;li class="li_2013 current"&gt;&lt;a class="current" href="/index.html"&gt;首页&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer1','','hide')" onmouseover="showHideLayer('layer1','','show')"&gt;公司金融&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer2','','hide')" onmouseover="showHideLayer('layer2','','show')"&gt;个人金融&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer3','','hide')" onmouseover="showHideLayer('layer3','','show')"&gt;银行卡&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer4','','hide')" onmouseover="showHideLayer('layer4','','show')"&gt;金融市场&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer5','','hide')" onmouseover="showHideLayer('layer5','','show')"&gt;电子银行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer6','','hide')" onmouseover="showHideLayer('layer6','','show')"&gt;投资者关系&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/" name="PL_MENU_NAME" onmouseout="showHideLayer('layer7','','hide')" onmouseover="showHideLayer('layer7','','show')"&gt;关于中行&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;!--子菜单--&gt;
&lt;div class="sub_menu" id="layer1" onmouseout="showHideLayer('layer1','','hide')" onmouseover="showHideLayer('layer1','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;!-- 获取公司金融下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb2/"&gt;公司融资服务&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb3/"&gt;贸易金融服务&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb4/"&gt;公司金融市场服务&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cncb6/"&gt;人民币结算服务&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/csdp/"&gt;机构结构性存款&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb1/"&gt;账户与存款&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/HainanEXPO/"&gt;服务第三届消博会&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/CIIEsrv/"&gt;服务第五届进博会&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb9/"&gt;普惠金融&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb7/"&gt;养老金服务&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/cb14/"&gt;全球现金管理&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./cbservice/bi2/"&gt;公告信息&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取公司金融下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） start--&gt;
&lt;ul class="sub_nav list sub_ad"&gt;
&lt;/ul&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="sub_menu" id="layer2" onmouseout="showHideLayer('layer2','','hide')" onmouseover="showHideLayer('layer2','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;!-- 获取个人金融下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb1/"&gt;存款与账户&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb2/"&gt;个人贷款&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb3/"&gt;个人理财&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb4/"&gt;个人汇兑&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pbsd/"&gt;个人结构性存款&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb10/"&gt;个人交易&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb7/"&gt;出国金融&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb8/"&gt;惠民金融&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb6/"&gt;私人银行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/pb5/"&gt;个人银行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/bi2/"&gt;公告信息&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./pbservice/bi3/"&gt;优惠活动&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取个人金融下下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） start--&gt;
&lt;ul class="sub_nav list sub_ad"&gt;
&lt;/ul&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="sub_menu" id="layer3" onmouseout="showHideLayer('layer3','','hide')" onmouseover="showHideLayer('layer3','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;!-- 获取银行卡下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bc1/"&gt;信用卡产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bc2/"&gt;借记卡产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bc3/"&gt;服务指南&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bi3/"&gt;优惠活动&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bi2/"&gt;公告信息&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bc5/"&gt;特色服务&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./bcservice/bi6/"&gt;精彩海淘&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取银行卡下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） start--&gt;
&lt;ul class="sub_nav list sub_ad"&gt;
&lt;/ul&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="sub_menu" id="layer4" onmouseout="showHideLayer('layer4','','hide')" onmouseover="showHideLayer('layer4','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;!-- 获取金融市场下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/cs8/"&gt;自营理财产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/bocwm/"&gt;子公司理财产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fp5/"&gt;托管理财产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fp6/"&gt;代销理财产品&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fund/"&gt;托管基金产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fp3/"&gt;柜台债券产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fp2/"&gt;代销基金产品&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fp4/"&gt;代理保险产品&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/foreignx/"&gt;外汇市场分析&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/boud/"&gt;债券市场分析&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/fm7/"&gt;黄金市场分析&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/stock/"&gt;证券市场分析&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list" style="background:none;"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/summarize/"&gt;宏观经济研究&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/cri/"&gt;中国银行人民币国际化指数&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/cfets_boc/"&gt;CFETS-BOC交易型债券指数&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./fimarkets/cifed/"&gt;境内外债券投融资比较指数&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取金融市场下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="sub_menu" id="layer5" onmouseout="showHideLayer('layer5','','hide')" onmouseover="showHideLayer('layer5','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;!-- 获取电子银行下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/bocnet_pb/"&gt;个人网上银行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/bocnet_cb/"&gt;企业网上银行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/bocmbs/"&gt;手机银行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/95566/"&gt;电话银行&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/service/"&gt;服务资料&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/security/"&gt;安全防护&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/bi3/"&gt;优惠活动&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/bi2/"&gt;公告信息&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/online/"&gt;便捷服务&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./ebanking/bocnet_login/"&gt;登录中行网银&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取电子银行下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） start--&gt;
&lt;ul class="sub_nav list sub_ad"&gt;
&lt;/ul&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="sub_menu" id="layer6" onmouseout="showHideLayer('layer6','','hide')" onmouseover="showHideLayer('layer6','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;ul class="sub_nav list"&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir1/"&gt;公司战略及投资价值&lt;/a&gt;&lt;/li&gt;
&lt;!-- 交易所公告 start--&gt;
&lt;li class="li_2013" style="color:#535353"&gt;交易所公告（&lt;a href="./investor/ir2/"&gt;H股&lt;/a&gt;、&lt;a href="./investor/ir5/"&gt;A股&lt;/a&gt;）&lt;/li&gt;
&lt;!-- 交易所公告 end--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir3/"&gt;财务报告&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir9/"&gt;监管资本&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;!-- 获取投资者关系下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir6/"&gt;公司治理&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir4/"&gt;公司资料&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir8/"&gt;资本市场荣誉&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/cnir7/"&gt;投资者服务&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir10/"&gt;可持续发展类债券&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./investor/ir11/"&gt;关联交易公告&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取投资者关系下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） start--&gt;
&lt;ul class="sub_nav list sub_ad"&gt;
&lt;/ul&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="sub_menu" id="layer7" onmouseout="showHideLayer('layer7','','hide')" onmouseover="showHideLayer('layer7','','show')"&gt;
&lt;i&gt;&lt;/i&gt;
&lt;div class="sub_area clearfix"&gt;
&lt;!-- 获取关于中行下的前n个子栏目的名称，数量由num控制 start--&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/bi1/"&gt;中行动态&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/ab8/"&gt;媒体看中行&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/ab2/"&gt;中行荣誉&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/boccsr/"&gt;企业社会责任&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/ab1/"&gt;中行概况&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/ab6/"&gt;中行机构&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/ab7/"&gt;中行历程&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/BCP/"&gt;消费者权益保护&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;ul class="sub_nav list"&gt;
&lt;!-- 显示格式为5行一列 start--&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/Beijing2022/"&gt;携手北京冬奥会&lt;/a&gt;&lt;/li&gt;
&lt;li class="li_2013"&gt;&lt;a href="./aboutboc/bi4/"&gt;招聘公告&lt;/a&gt;&lt;/li&gt;
&lt;!-- 显示格式为5行一列 end--&gt;
&lt;/ul&gt;
&lt;!-- 获取关于中行下的前n个子栏目的名称，数量由num控制 end--&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） start--&gt;
&lt;ul class="sub_nav list sub_ad"&gt;
&lt;/ul&gt;
&lt;!-- 取头条新闻的前2篇文档（标题+附件） end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--子菜单end--&gt;
&lt;/div&gt;&lt;!--导航-end--&gt;
&lt;/div&gt;
&lt;!--header-end--&gt;
&lt;!--banner--&gt;
&lt;div class="banner com_box"&gt;
&lt;!--首页图片轮换取图片附件begin--&gt;
&lt;div class="bn_img"&gt;
&lt;!-- &lt;a href="#" target="_self"&gt;   --&gt;
&lt;a href="https://www.bankofchina.com/investor/cnir7/201402/t20140219_2936277.html" title="中国银行2023年年度业绩发布会网上直播"&gt;
&lt;img alt="中国银行2023年度业绩发布会网上直�?8x288.jpg" height="288px" src="https://pic.bankofchina.com/bocappd/ad/cnad1/202403/W020240326311223095719.jpg" width="978px"/&gt;
&lt;/a&gt;
&lt;a href="https://www.bankofchina.com/cbservice/cb9/202403/t20240312_24747308.html" title="中国银行积极开展“第一届普惠金融推进月”行动"&gt;
&lt;img alt="中国银行积极�?展�?�第�?届普惠金融推进月”行�?8x288.jpg" class='\"hidden\"' height="288px" src="https://pic.bankofchina.com/bocappd/ad/cnad1/202403/W020240315842618146796.jpg" width="978px"/&gt;
&lt;/a&gt; &lt;a href="https://www.bankofchina.com/aboutboc/bi4/202403/t20240301_24662090.html" title="中国银行2024年春季招聘和实习生招聘"&gt;
&lt;img alt="中国银行2024年春季招聘和实习生招聘.jpg" class='\"hidden\"' height="288px" src="https://pic.bankofchina.com/bocappd/ad/cnad1/202403/W020240301584728332444.jpg" width="978px"/&gt;
&lt;/a&gt; &lt;a href="https://www.bankofchina.com/ebanking/online/202101/t20210105_18941711.html" title="普惠金融在线融资——中银企E贷"&gt;
&lt;img alt="普惠金融在线融资——中银企E贷978x288.jpg" class='\"hidden\"' height="288px" src="https://pic.bankofchina.com/bocappd/ad/cnad1/202102/W020210305848707945210.jpg" width="978px"/&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!--首页图片轮换取图片附件end--&gt;
&lt;div class="banner_nav"&gt;
&lt;!--首页图片轮换取文档标题begin--&gt;
&lt;span class="trigger imgSelected"&gt;
        2023年年度&lt;br/&gt;业绩发布会
        &lt;i&gt;&lt;/i&gt; &lt;/span&gt;
&lt;span class="trigger" href="javascript:void(0)"&gt;
        普聚金融服务&lt;br/&gt;惠及千企万户
        &lt;i&gt;&lt;/i&gt; &lt;/span&gt; &lt;span class="trigger" href="javascript:void(0)"&gt;
        以“中”为始&lt;br/&gt;同“行”未来
        &lt;i&gt;&lt;/i&gt; &lt;/span&gt; &lt;span class="trigger" href="javascript:void(0)"&gt;
        普惠在线融资&lt;br/&gt;中银企E贷
        &lt;i&gt;&lt;/i&gt; &lt;/span&gt;
&lt;!--首页图片轮换取文档标题end--&gt;
&lt;div class="fl" style="padding-top: 0;"&gt;
&lt;!--取关注我们栏目8、9篇文档开始--&gt;
&lt;!--&lt;p class="attend"&gt;关注我们：
           &lt;a href="./custserv/cs1/201209/t20120921_1989080.html" class="sina" title="新浪"&gt;&lt;/a&gt; 
           &lt;a href="./custserv/cs1/201301/t20130115_2126343.html" class="wx" title="微信"&gt;&lt;/a&gt; 
          &lt;a href="https://95566.boc.cn/mccmmg-bocweb/" class="zxkf" title="在线客服"&gt;&lt;/a&gt;
        &lt;/p&gt;--&gt;
&lt;!--取关注我们栏目8、9篇文档结束--&gt;
&lt;!--&lt;p&gt;&lt;span&gt;www.bankofchina.com&lt;/span&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;span&gt;www.boc.cn&lt;/span&gt;&lt;/p&gt;--&gt;
&lt;div style="margin: 4px auto 0;width: 122px; "&gt;
&lt;a href="./custserv/dilogo/202011/t20201127_18693492.html" title="存款保险"&gt;
&lt;img alt="存款保险" height="82" src="./custserv/dilogo/images/P020201127536628334583.gif" width="122"/&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--login--&gt;
&lt;div class="index_lg"&gt;
&lt;!--2013-嵌-个人客户网银登陆begin--&gt;
&lt;a href="/ebanking/bocnet_login/" title="请从www.boc.cn, www.bankofchina.com进入"&gt;个人客户网银登录&lt;/a&gt;
&lt;!--2013-嵌-个人客户网银登陆end--&gt;
&lt;!--2013-嵌-个人贵宾网银登陆begin--&gt;
&lt;a href="/ebanking/bocnet_login/index1.html" title="请从www.boc.cn, www.bankofchina.com进入"&gt;个人贵宾网银登录&lt;/a&gt;
&lt;!--2013-嵌-个人贵宾网银登陆end--&gt;
&lt;!--2013-嵌-企业客户网银登陆begin--&gt;
&lt;a href="/ebanking/bocnet_login/index2.html" title="请从www.boc.cn, www.bankofchina.com进入"&gt;企业客户网银登录&lt;/a&gt;
&lt;!--2013-嵌-企业客户网银登陆end--&gt;
&lt;!--2020-嵌-iGTB企业网银登录begin--&gt;
&lt;a href="/ebanking/bocnet_login/index_1750.html" title="请从www.boc.cn, www.bankofchina.com进入"&gt;iGTB企业网银登录&lt;/a&gt;
&lt;!--2020-嵌-iGTB企业网银登录end--&gt;
&lt;!--2013-嵌-中国银行海外网银登陆begin--&gt;
&lt;a href="./ebanking/bocnet_login/201312/t20131222_2816321.html"&gt;中行海外网银登录&lt;/a&gt;
&lt;!--2013-嵌-中国银行海外网银登陆end--&gt;
&lt;/div&gt;
&lt;!--login--&gt;
&lt;/div&gt;
&lt;!--banner-end--&gt;
&lt;!--main-start--&gt;
&lt;div class="main"&gt;
&lt;!--com_box--&gt;
&lt;div class="com_box clearfix"&gt;
&lt;!--实用信息子栏目：重要公告begin--&gt;
&lt;div class="msg1"&gt;
&lt;div class="tabs" id="tab3"&gt;
&lt;ul class="tab_nav clearfix"&gt;
&lt;li class="selected" style="border: none;cursor: auto;font-size: 20px;"&gt;中行动态&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="tab_content clearfix" style="display:block;"&gt;
&lt;ul class="list"&gt;
&lt;li&gt;&lt;a href="./aboutboc/bi1/202404/t20240410_24877801.html" title="中国银行成立科技金融中心"&gt;
                  中国银行成立科技金融中心
                  &lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="./aboutboc/bi1/202404/t20240409_24869934.html" title="中国银行与黑龙江省政府签署全面战略合作协议 葛海蛟出席签约活动"&gt;
                  中国银行与黑龙江省政府签署全面战略合作...
                  &lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="./aboutboc/bi1/202404/t20240409_24869932.html" title="以金融之力支持做好发展新质生产力这篇大文章 葛海蛟在黑龙江开展工作调研"&gt;
                  以金融之力支持做好发展新质生产力这篇大...
                  &lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./aboutboc/bi1/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--tab--&gt;
&lt;/div&gt;
&lt;div class="msg1"&gt;
&lt;div class="tabs" id="tab3"&gt;
&lt;ul class="tab_nav clearfix"&gt;
&lt;li class="selected" style="border: none;cursor: auto;font-size: 20px;"&gt;重要公告&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="tab_content clearfix" style="display:block;"&gt;
&lt;ul class="list"&gt;
&lt;li&gt;&lt;a href="./fimarkets/bi2/202404/t20240409_24862699.html" title="关于4月14日系统升级期间暂停投资理财相关服务的公告"&gt;
                  关于4月14日系统升级期间暂停投资理财相关...
                  &lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="./custserv/bi2/bi2o/202404/t20240409_24862133.html" title="关于开展小微企业支付手续费降费情况调查的公告"&gt;
                  关于开展小微企业支付手续费降费情况调查...
                  &lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="./fimarkets/bi2/202404/t20240408_24854736.html" title="关于代理个人上金所业务调整白银延期合约业务参数的公告(2024年4月9日)"&gt;
                  关于代理个人上金所业务调整白银延期合约...
                  &lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./custserv/bi2/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--tab--&gt;
&lt;/div&gt;
&lt;div class="msg1" style="border: none;"&gt;
&lt;div class="tabs" id="tab3"&gt;
&lt;ul class="tab_nav clearfix"&gt;
&lt;li class="selected" style="border: none;cursor: auto;font-size: 20px;"&gt;服务价目公示&lt;/li&gt;
&lt;/ul&gt;
&lt;div class="tab_content clearfix" style="display:block;"&gt;
&lt;ul class="list"&gt;
&lt;li&gt;&lt;a href="./ebanking/bi3/bi31/202312/t20231229_24338136.html" title="中行电子银行转账汇款大优惠(2024年)"&gt;
                  中行电子银行转账汇款大优惠(2024年)
                  &lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="./ebanking/bi2/202312/t20231222_24315153.html" title="关于个人网银跨行人民币汇款手续费减免的公告(2023年12月22日至2024年3月22日)"&gt;
                  关于个人网银跨行人民币汇款手续费减免的...
                  &lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="./bcservice/bi2/202311/t20231113_24043704.html" title="2024年信用卡年费减免政策"&gt;
                  2024年信用卡年费减免政策
                  &lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./custserv/fd5/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--tab--&gt;
&lt;/div&gt;
&lt;!--实用信息子栏目：重要公告end--&gt;
&lt;/div&gt;
&lt;!--com_box-end--&gt;
&lt;!--com_box--&gt;
&lt;div class="com_box clearfix"&gt;
&lt;div class="bjfw_box"&gt;
&lt;div class="bjfw_l"&gt;便捷&lt;br/&gt;服务&lt;/div&gt;
&lt;div class="bjfw_r"&gt;
&lt;div class="scroller"&gt;
&lt;!--123--&gt;
&lt;div class="es-carousel-wrapper" id="carousel"&gt;
&lt;div class="es-carousel_o"&gt;
&lt;div class="es-carousel"&gt;
&lt;ul&gt;
&lt;li style="width: 885px;padding-top: 6px;"&gt;
&lt;div class="bjfw"&gt;
&lt;a href="http://www.bankofchina.com/ebanking/service/cs1/201009/t20100921_1151946.html"&gt;&lt;img alt="手机银行客户端软件下载" src="./ebanking/online/201401/W020140111725822929454.gif"/&gt;&lt;span&gt;
		                      手机银行&lt;br/&gt;客户端
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/202401/t20240105_24363500.html"&gt;&lt;img alt="“中银智采”平台" src="./ebanking/online/202401/W020240105413481879803.gif"/&gt;&lt;span&gt;
		                      中银智采
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/201807/t20180716_12929216.html"&gt;&lt;img alt="对公客户在线预约开户" src="./ebanking/online/201807/W020180716814013662451.gif"/&gt;&lt;span&gt;
		                      对公在线预约开户
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/201310/t20131027_2574351.html"&gt;&lt;img alt="客户协议与须知" src="./ebanking/online/201310/W020140111729687070615.gif"/&gt;&lt;span&gt;
		                      协议须知
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/201310/t20131024_2567778.html"&gt;&lt;img alt="在线申请信用卡" src="./ebanking/online/201310/W020140111810711646011.gif"/&gt;&lt;span&gt;
		                      在线申请信用卡
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/201712/t20171226_10995715.html"&gt;&lt;img alt="中国银行托管服务平台" src="./ebanking/online/201712/W020171229687598235427.gif"/&gt;&lt;span&gt;
		                      托管服务平台
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="http://as.boc.cn/index.jsp"&gt;&lt;img alt="养老金客户服务系统" src="./ebanking/online/201312/W020140111808305172664.gif"/&gt;&lt;span&gt;
		                      养老金服务
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/201310/t20131024_2567731.html"&gt;&lt;img alt="回单验证服务" src="./ebanking/online/201310/W020140111739730885386.gif"/&gt;&lt;span&gt;
		                      回单验证
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/201605/t20160529_6979981.html"&gt;&lt;img alt="业务验证" src="./ebanking/online/201605/W020160529256619089221.gif"/&gt;&lt;span&gt;
		                      业务验证
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;div class="bjfw"&gt;
&lt;a href="./ebanking/online/202311/t20231124_24118478.html"&gt;&lt;img alt="“同e赢”平台" src="./ebanking/online/202311/W020231124599727902383.gif"/&gt;&lt;span&gt;
		                      “同e赢”&lt;br/&gt;平台
		                      &lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--&lt;div class="es-nav"&gt;
		            	&lt;a href="javascript:void(0)" class="es-nav-prev" target="_self"&gt;Previous&lt;/a&gt;
		            	&lt;a href="javascript:void(0)" class="es-nav-next" target="_self"&gt;Next&lt;/a&gt;
		            &lt;/div&gt;--&gt;
&lt;/div&gt;
&lt;!--123--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--com_box-end--&gt;
&lt;!--com_box--&gt;
&lt;div class="com_box serves1 clearfix" style="height: 340px;"&gt;
&lt;div class="con_r" style="float: left;width: 288px;padding-right: 20px;border-right: 1px solid #dadada;height: 342px;"&gt;
&lt;h3 class="title" style="margin: 0;padding: 20px 0 10px 0;background: url(https://www.bankofchina.com/images/boc2013_dot_linex.gif) repeat-x 0 bottom;"&gt; 金融数据 &lt;/h3&gt;
&lt;h4 style="background: none;margin-bottom: 0;margin-top: 13px;"&gt;
&lt;a href="http://www.boc.cn/sourcedb/whpj/" style="cursor:pointer" title="中国银行外汇牌价"&gt;&lt;span&gt;
            中国银行外汇牌价
            &lt;/span&gt;&lt;/a&gt;
&lt;/h4&gt;
&lt;ul class="list"&gt;
&lt;!--取cn金融数据栏目下文档begin--&gt;
&lt;li&gt; &lt;a href="./fimarkets/201401/t20140112_2816516.html"&gt;
              中国银行海外分行外汇牌价
              &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="https://www.bankofchina.com/sourcedb/ffx/"&gt;
              中国银行远期外汇牌价
              &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="http://www.bankofchina.com/fimarkets/lilv/"&gt;
              存/贷款利率
              &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="/sourcedb/cfets_boc/"&gt;
              CFETS-BOC交易型债券指数
              &lt;/a&gt; &lt;/li&gt;
&lt;li style="float:left;width:110px; "&gt; &lt;a href="http://www.bankofchina.com/sourcedb/nv_fund/"&gt;
              代销基金净值
              &lt;/a&gt; &lt;/li&gt;
&lt;li style="float:left;width:125px; background:none;"&gt; &lt;a href="http://www.bankofchina.com/sourcedb/nv_broker/"&gt;
              券商产品净值
              &lt;/a&gt; &lt;/li&gt;
&lt;li style="float:left;width:110px;"&gt; &lt;a href="/fimarkets/cs8/lcjz/"&gt;
              自营理财产品净值
              &lt;/a&gt; &lt;/li&gt;
&lt;li style="float:left;width:125px; background:none;"&gt; &lt;a href="/fimarkets/bocwm/fp82/"&gt;
              子公司理财产品净值
              &lt;/a&gt; &lt;/li&gt;
&lt;li style="float:left;"&gt; &lt;a href="http://www.bankofchina.com/fimarkets/cri/"&gt;
              中国银行人民币国际化指数
              &lt;/a&gt; &lt;/li&gt;
&lt;li style="float:left;"&gt; &lt;a href="http://www.bankofchina.com/fimarkets/cifed/"&gt;
              境内外债券投融资比较指数
              &lt;/a&gt; &lt;/li&gt;
&lt;!--取cn金融数据栏目下文档end--&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;div class="con_l clearfix" style="float: right;border: none;padding: 0 0 0 20px;width: 608px;"&gt;
&lt;h3 class="title" style="margin: 0;padding: 20px 0 10px 0;background: url(https://www.bankofchina.com/images/boc2013_dot_linex.gif) repeat-x 0 bottom;width: 590px;"&gt;金融市场分析&lt;/h3&gt;
&lt;div style="float: left;width: 48%;margin-right: 27px;padding: 20px 0 9px 0;border-bottom: 1px solid #dadada;"&gt;
&lt;p style="width: 100%;float: none;border: none;padding: 0;"&gt; &lt;a class="con_l_nobg" href="./fimarkets/summarize/"&gt;&lt;span&gt;
	          宏观经济研究
	         &lt;/span&gt;&lt;/a&gt;
&lt;/p&gt;
&lt;p class="con_l_li" style="background: none;width: 100%;float: none;padding: 0;"&gt;
&lt;a href="./fimarkets/summarize/202404/t20240401_24828082.html" title="中国银行研究院发布《2024年二季度经济金融展望报告》"&gt;
	            中国银行研究院发布《2024年二季度经...
	            &lt;/a&gt;
&lt;/p&gt;
&lt;p style="width: 100%;float: none;padding: 0;border: none;"&gt;
&lt;a href="./fimarkets/summarize/202403/t20240329_24820737.html" title="《宏观观察》2024年第22期：中国信用债市场发展的新特征、主要问题及政策建议"&gt;
	            《宏观观察》2024年第22期：中国信用债市...
	            &lt;/a&gt; &lt;a href="./fimarkets/summarize/202403/t20240319_24756886.html" title="《宏观观察》2024年第20期：如何理解拓展我国中间品贸易新增长点？"&gt;
	            《宏观观察》2024年第20期：如何理解拓展...
	            &lt;/a&gt; &lt;a href="./fimarkets/summarize/202403/t20240312_24747310.html" title="《宏观观察》2024年第17期：超长期特别国债成为财政政策加力提效的重要抓手"&gt;
	            《宏观观察》2024年第17期：超长期特别国...
	            &lt;/a&gt;
&lt;/p&gt;
&lt;/div&gt;
&lt;p style="width: 42%;"&gt; &lt;a class="con_l_nobg" href="./fimarkets/foreignx/"&gt;&lt;span&gt;
          外汇市场分析
          &lt;/span&gt;&lt;/a&gt;
&lt;a href="./fimarkets/foreignx/202404/t20240410_24870378.html" title="汇市日评2024年4月10日"&gt;
            汇市日评2024年4月10日
            &lt;/a&gt; &lt;a href="./fimarkets/foreignx/202404/t20240410_24869976.html" title="汇市观潮2024年4月10日"&gt;
            汇市观潮2024年4月10日
            &lt;/a&gt; &lt;a href="./fimarkets/foreignx/202404/t20240409_24862522.html" title="汇市日评2024年4月9日"&gt;
            汇市日评2024年4月9日
            &lt;/a&gt; &lt;a href="./fimarkets/foreignx/202404/t20240409_24862127.html" title="汇市观潮2024年4月9日"&gt;
            汇市观潮2024年4月9日
            &lt;/a&gt;
&lt;/p&gt;
&lt;p class="last" style="margin-right: 27px;width: 48%;"&gt; &lt;a class="con_l_nobg" href="./fimarkets/fm7/"&gt;&lt;span&gt;
          黄金市场分析
          &lt;/span&gt;&lt;/a&gt;
&lt;a href="./fimarkets/fm7/202404/t20240410_24869975.html" title="20240410—黄金投资魅力增强 金价创高欲罢不能"&gt;
            20240410—黄金投资魅力增强 金价创高欲罢...
            &lt;/a&gt; &lt;a href="./fimarkets/fm7/202404/t20240409_24862126.html" title="20240409—黄金多头热度不减 金价继续创新高"&gt;
            20240409—黄金多头热度不减 金价继续创新高
            &lt;/a&gt;
&lt;/p&gt;
&lt;p class="last" style="width: 42%;"&gt; &lt;a class="con_l_nobg" href="./fimarkets/boud/"&gt;&lt;span&gt;
          债券市场分析
          &lt;/span&gt;&lt;/a&gt;
&lt;a href="./fimarkets/boud/202404/t20240410_24869978.html" title="固定收益日报2024年4月10日"&gt;
            固定收益日报2024年4月10日
            &lt;/a&gt; &lt;a href="./fimarkets/boud/202404/t20240409_24862121.html" title="固定收益日报2024年4月9日"&gt;
            固定收益日报2024年4月9日
            &lt;/a&gt;
&lt;/p&gt;
&lt;/div&gt;
&lt;!--left--&gt;
&lt;!--right--&gt;
&lt;/div&gt;
&lt;!--com-box-end--&gt;
&lt;!--com_box--&gt;
&lt;div class="com_box serves"&gt;
&lt;div style="overflow: hidden;"&gt;
&lt;h3 class="title title2" style="width: 632px;float: left;"&gt;特色服务&lt;/h3&gt;
&lt;h3 class="title title2" style="width: 306px;float: left;"&gt;投资理财&lt;/h3&gt;
&lt;/div&gt;
&lt;!--个人客户服务--&gt;
&lt;div class="con_area clearfix"&gt;
&lt;!--在个人金融取2篇文档begin--&gt;
&lt;div class="fl ca_fw" style="border-right: 0;padding-right: 28px;"&gt;
&lt;div class="picBox clearfix" style="width: 268px;"&gt; &lt;img alt="中国银行境外来宾支付服务手册" height="124" src="./ebanking/service/cs1/202404/W020240407618139569582.jpg" title="中国银行境外来宾支付服务手册" width="131"/&gt;
&lt;h3&gt;&lt;a href="./ebanking/service/cs1/202404/t20240403_24845717.html" title="中国银行境外来宾支付服务手册"&gt;
                中国银行境外来宾支付服务手册
                &lt;/a&gt;&lt;/h3&gt;
&lt;p&gt;
&lt;/p&gt;
&lt;p class="more"&gt;&lt;a href="./ebanking/service/cs1/202404/t20240403_24845717.html"&gt;了解详情&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;div class="picBox clearfix" style="width: 268px;"&gt; &lt;img alt="中国银行手机银行“房贷利率调整”功能操作指南" height="124" src="./ebanking/service/cs1/202309/W020230922427414500606.jpg" title="中国银行手机银行“房贷利率调整”功能操作指南" width="131"/&gt;
&lt;h3&gt;&lt;a href="./ebanking/service/cs1/202309/t20230922_23802951.html" title="中国银行手机银行“房贷利率调整”功能操作指南"&gt;
                中国银行手机银行“房贷利率调整”功能操作指南
                &lt;/a&gt;&lt;/h3&gt;
&lt;p&gt;
&lt;/p&gt;
&lt;p class="more"&gt;&lt;a href="./ebanking/service/cs1/202309/t20230922_23802951.html"&gt;了解详情&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="fl ca_fw" style="padding-left: 0;padding-right: 32px;"&gt;
&lt;div class="picBox clearfix" style="width: 268px;"&gt; &lt;img alt="中银跨境理财通" height="124" src="./pbservice/pb3/202110/W020211218320304214351.gif" title="中银跨境理财通" width="131"/&gt;
&lt;h3&gt;&lt;a href="./pbservice/pb3/202110/t20211018_20246430.html" title="中银跨境理财通"&gt;
                中银跨境理财通
                &lt;/a&gt;&lt;/h3&gt;
&lt;p&gt;
                粤港澳大湾区专属
              &lt;/p&gt;
&lt;p class="more"&gt;&lt;a href="./pbservice/pb3/202110/t20211018_20246430.html"&gt;了解详情&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;div class="picBox clearfix" style="width: 268px;"&gt; &lt;img alt="跨境人民币" height="124" src="./cbservice/201401/W020220215535257790838.jpg" title="跨境人民币" width="131"/&gt;
&lt;h3&gt;&lt;a href="http://www.bankofchina.com/cbservice/cb11/" title="跨境人民币"&gt;
                跨境人民币
                &lt;/a&gt;&lt;/h3&gt;
&lt;p&gt;
                人民币，全球贸易和投资新选择
              &lt;/p&gt;
&lt;p class="more"&gt;&lt;a href="http://www.bankofchina.com/cbservice/cb11/"&gt;了解详情&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="fl ca_fw serves1" style="border: 0;height: auto;"&gt;
&lt;div class="con_l" style="width: 282px;height: auto;border: none;padding-bottom: 12px;"&gt;
&lt;p style="width: 100%;margin-right: 0;padding-top: 10px;"&gt; &lt;a class="con_l_nobg" href="./fimarkets/cs8/"&gt;&lt;span&gt;
	          	自营理财
	          &lt;/span&gt;&lt;/a&gt;
&lt;a href="./fimarkets/cs8/bi5/202404/t20240408_24854442.html" title="“中银平稳理财计划-智荟”系列产品发行公告(2024年4月8日更新)"&gt;
	            “中银平稳理财计划-智荟”系列产品发行公告(2024年4月8日更新)
	            &lt;/a&gt; &lt;a href="./fimarkets/cs8/bi5/202404/t20240408_24854441.html" title="“中银平稳理财计划-智荟”系列产品到期公告(2024年4月8日更新)"&gt;
	            “中银平稳理财计划-智荟”系列产品到期公告(2024年4月8日更新)
	            &lt;/a&gt;
&lt;/p&gt;
&lt;p class="last" style="width: 100%;margin-right: 0;"&gt; &lt;a class="con_l_nobg" href="./fimarkets/bocwm/"&gt;&lt;span&gt;
	          	子公司理财
	          &lt;/span&gt;&lt;/a&gt;
&lt;a href="./fimarkets/bocwm/fp81/202404/t20240409_24869931.html" title="关于“中银理财-怡享天天13号”产品费率优惠的公告(2024年4月10日-2024年5月9日)"&gt;
	            关于“中银理财-怡享天天13号”产品费率优...
	            &lt;/a&gt; &lt;a href="./fimarkets/bocwm/fp81/202404/t20240408_24854468.html" title="“中银理财-稳富(封闭式)2023年45期-WF2023045D”产品到期公告"&gt;
	            “中银理财-稳富(封闭式)2023年45期-WF202...
	            &lt;/a&gt; &lt;a href="./fimarkets/bocwm/fp81/202404/t20240408_24854467.html" title="“中银理财-稳富(封闭式)2023年45期-WF2023045B”产品到期公告"&gt;
	            “中银理财-稳富(封闭式)2023年45期-WF202...
	            &lt;/a&gt; &lt;a href="./fimarkets/bocwm/fp81/202404/t20240408_24854466.html" title="“中银理财-稳富(封闭式)2023年45期-WF2023045A”产品到期公告"&gt;
	            “中银理财-稳富(封闭式)2023年45期-WF202...
	            &lt;/a&gt;
&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--right--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--com_box-end--&gt;
&lt;!--com-box--&gt;
&lt;div class="com_box serves2" style="height: 440px;"&gt;
&lt;div class="con_l" style="height: 420px;width: 288px;"&gt;
&lt;!--取企业社会责任栏目下文档begin--&gt;
&lt;h3 class="title"&gt;企业社会责任&lt;/h3&gt;
&lt;div class="qysh_box"&gt;
&lt;a href="../../../aboutboc/bi1/202403/t20240328_24820091.html" title="中国银行2023年度社会责任报告（环境、社会、治理）"&gt;
&lt;img alt="中国银行2023年度社会责任报告（环境、社会、治理）" height="124" src="./aboutboc/boccsr/202403/W020240331828605941435.jpg" title="中国银行2023年度社会责任报告（环境、社会、治理）" width="262"/&gt;
&lt;div class="qysh_bg"&gt;&lt;/div&gt;
&lt;div class="qysh_title"&gt;中国银行2023年度社会责任报告（环境、社...&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;ul class="list" style="margin-top: 5px;"&gt;
&lt;li&gt; &lt;a href="./aboutboc/boccsr/202402/t20240223_24617290.html" title="中国银行积极推动中美文化交流与民间交往"&gt;
              中国银行积极推动中美文化交流与民间交往
              &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/boccsr/202402/t20240219_24586030.html" title="新春走基层｜筑牢“防护网” 中国银行助力守护养老“钱袋子”"&gt;
              新春走基层｜筑牢“防护网” 中国银行助力...
              &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more" style="margin-top: 15px;"&gt;&lt;a href="./aboutboc/boccsr/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;!--取企业社会责任栏目下文档end--&gt;
&lt;div style="position: relative;"&gt;
&lt;h3 class="title" style="font-size: 16px;line-height: 26px;height: 26px;"&gt;可持续发展类债券&lt;/h3&gt;
&lt;ul class="list"&gt;
&lt;li&gt; &lt;a href="./investor/ir10/202304/t20230414_22900987.html" title="中国银行可持续发展类债券2022年度报告"&gt;
	              中国银行可持续发展类债券2022年度报告
	              &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir10/202304/t20230414_22900985.html" title="中国银行转型债券2022年度报告"&gt;
	              中国银行转型债券2022年度报告
	              &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more" style="margin-top: 15px;"&gt;&lt;a href="./investor/ir10/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--left--&gt;
&lt;div class="con_r"&gt;
&lt;!--取投资者关系栏目下文档begin--&gt;
&lt;div class="cc"&gt;
&lt;h3 class="title"&gt;投资者关系&lt;/h3&gt;
&lt;ul class="list clearfix"&gt;
&lt;li&gt; &lt;a href="./investor/ir5/202404/t20240408_24862101.html" title="中国银行股份有限公司关于二级资本债券发行完毕的公告"&gt;
                中国银行股份有限公司关于二级资本债券发行...
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir5/202404/t20240408_24862100.html" title="中国银行股份有限公司关于副行长刘进先生任职的公告"&gt;
                中国银行股份有限公司关于副行长刘进先生任...
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir5/202404/t20240408_24862099.html" title="中国银行股份有限公司关于执行董事张毅先生任职的公告"&gt;
                中国银行股份有限公司关于执行董事张毅先生...
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir2/202404/t20240408_24862098.html" title="公告-二级资本债券发行完毕"&gt;
                公告-二级资本债券发行完毕
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir2/202404/t20240408_24862097.html" title="公告-本行副行长刘进先生之委任"&gt;
                公告-本行副行长刘进先生之委任
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir2/202404/t20240408_24862096.html" title="董事名单与其角色和职能"&gt;
                董事名单与其角色和职能
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir2/202404/t20240408_24862095.html" title="公告-本行执行董事张毅先生之委任"&gt;
                公告-本行执行董事张毅先生之委任
                &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./investor/ir5/202404/t20240403_24852957.html" title="中国银行股份有限公司关于非执行董事楼小惠女士任职的公告"&gt;
                中国银行股份有限公司关于非执行董事楼小惠...
                &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./investor/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;!--取投资者关系栏目下文档end--&gt;
&lt;div class="bb clearfix"&gt;
&lt;!--取社会责任栏目下文档begin--&gt;
&lt;div class="bb_l" style="height: 170px;"&gt;
&lt;div class="tabs" id="tab4"&gt;
&lt;ul class="tab_nav clearfix"&gt;
&lt;li class="selected" onclick="tabs('#tab4',0);"&gt; &lt;a href="javascript:void(0)" target="_self"&gt;消费者权益保护 &lt;/a&gt; &lt;/li&gt;
&lt;li class="last" onclick="tabs('#tab4',1);"&gt; &lt;a href="javascript:void(0)" target="_self"&gt;媒体看中行 &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;div class="tab_content clearfix" style="display:block;"&gt;
&lt;ul class="list"&gt;
&lt;li&gt; &lt;a href="./aboutboc/BCP/202403/t20240315_24740099.html" title="书写“消保为民”新篇章 中国银行积极开展“3•15”金融消费者权益保护教育宣传活动"&gt;
                      书写“消保为民”新篇章 中国银行积极开...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/BCP/202403/t20240315_24739705.html" title="2024年“3•15”金融消费者权益保护教育系列宣传：金融消费者八项基本权利"&gt;
                      2024年“3•15”金融消费者权益保护教育...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/BCP/202403/t20240315_24747336.html" title="2024年“3•15”金融消费者权益保护教育系列宣传：金融消费者维权应该怎么做？"&gt;
                      2024年“3•15”金融消费者权益保护教育...
                      &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./aboutboc/BCP/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;div class="tab_content clearfix"&gt;
&lt;ul class="list"&gt;
&lt;li&gt; &lt;a href="./aboutboc/ab8/202403/t20240322_24787598.html" title="中国银行助力解决外籍来华人士支付堵点【人民日报客户端】"&gt;
                      中国银行助力解决外籍来华人士支付堵点...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/ab8/202403/t20240308_24699595.html" title="中国银行高质量金融服务为经济发展添动能【金融时报】"&gt;
                      中国银行高质量金融服务为经济发展添动...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/ab8/202403/t20240307_24691016.html" title="中国银行高质量服务江苏建设现代化产业体系【人民日报】"&gt;
                      中国银行高质量服务江苏建设现代化产业...
                      &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./aboutboc/ab8/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--取社会责任栏目下文档end--&gt;
&lt;!--取招聘公告及采购公告栏目名称与文档列表begin--&gt;
&lt;div class="bb_r"&gt;
&lt;div class="tabs" id="tab2"&gt;
&lt;ul class="tab_nav clearfix"&gt;
&lt;li class="selected" onclick="tabs('#tab2',0);"&gt; &lt;a href="javascript:void(0)" target="_self"&gt;招聘公告 &lt;/a&gt; &lt;/li&gt;
&lt;li class="last" onclick="tabs('#tab2',1);"&gt; &lt;a href="javascript:void(0)" target="_self"&gt;采购公告 &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;div class="tab_content clearfix" style="display:block;"&gt;
&lt;ul class="list"&gt;
&lt;li&gt; &lt;a href="./aboutboc/bi4/202404/t20240403_24845714.html" title="中国银行股份有限公司2024年度拟接收境内院校应届毕业生情况公示(第二批)"&gt;
                      中国银行股份有限公司2024年度拟接收境...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/bi4/202403/t20240301_24662090.html" title="中国银行股份有限公司2024年春季招聘公告"&gt;
                      中国银行股份有限公司2024年春季招聘公告
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/bi4/202403/t20240301_24662089.html" title="中国银行股份有限公司2024年实习生招聘公告"&gt;
                      中国银行股份有限公司2024年实习生招聘公告
                      &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./aboutboc/bi4/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;div class="tab_content clearfix"&gt;
&lt;ul class="list"&gt;
&lt;li&gt; &lt;a href="./aboutboc/bi6/202312/t20231227_24322620.html" title="关于中银智采平台于2024年1月1日投入使用的公告"&gt;
                      关于中银智采平台于2024年1月1日投入...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/bi6/202404/t20240409_24869929.html" title="中国银行股份有限公司2022年-2023年软件中心其他设备(视频会议设备)项目“视频会议终端”分包招标结果公示"&gt;
                      中国银行股份有限公司2022年-2023年软...
                      &lt;/a&gt; &lt;/li&gt;
&lt;li&gt; &lt;a href="./aboutboc/bi6/202404/t20240407_24854401.html" title="中国银行股份有限公司海外借记卡空白卡制作及个人化项目(第三次)招标公告"&gt;
                      中国银行股份有限公司海外借记卡空白...
                      &lt;/a&gt; &lt;/li&gt;
&lt;/ul&gt;
&lt;p class="more"&gt;&lt;a href="./aboutboc/bi6/"&gt;更多&amp;gt;&lt;/a&gt;&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--tab--&gt;
&lt;/div&gt;
&lt;!--取招聘公告及采购公告栏目名称与文档列表end--&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--right--&gt;
&lt;/div&gt;
&lt;!--com-box-end--&gt;
&lt;!--com-box--&gt;
&lt;div class="com_box clearfix map"&gt;
&lt;div class="map_area"&gt;
&lt;h3 class="title"&gt;
&lt;a href="./custserv/cs1/201312/t20131230_2805579.html"&gt;全球服务&lt;/a&gt;
&lt;/h3&gt;
&lt;div class="zz1"&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/mo/"&gt;
                      澳门地区
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/tw/"&gt;
                      台湾地区
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/sg/"&gt;
                      新加坡
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/jp/"&gt;
                      日本
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/th/"&gt;
                      泰国
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/vn/"&gt;
                      越南
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/my/"&gt;
                      马来西亚
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/id/"&gt;
                      印度尼西亚
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/kh/"&gt;
                      柬埔寨
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/ru/"&gt;
                      俄罗斯
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/uk/"&gt;
                      英国
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/fr/"&gt;
                      法国
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/lu/"&gt;
                      卢森堡
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/be/"&gt;
                      比利时
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/nl/"&gt;
                      荷兰
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/pl/"&gt;
                      波兰
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/se/"&gt;
                      瑞典
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/de/"&gt;
                      德国
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/it/"&gt;
                      意大利
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/hu/"&gt;
                      匈牙利
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/zm/"&gt;
                      赞比亚
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/us/"&gt;
                      美国
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/ca/"&gt;
                      加拿大
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/pa/"&gt;
                      巴拿马
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/br/"&gt;
                      巴西
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/nz/"&gt;
                      新西兰
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/au/"&gt;
                      澳大利亚
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/kr/"&gt;
                      韩国
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/rs/"&gt;
                      塞尔维亚
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/mu/"&gt;
                      毛里求斯
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/tr/"&gt;
                      土耳其
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/mx/"&gt;
                      墨西哥
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/at/"&gt;
                      奥地利
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/pt/"&gt;
                      葡萄牙
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/za/"&gt;
                      南非
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/cz/"&gt;
                      捷克
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/cl/"&gt;
                      智利
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/la/"&gt;
                      老挝
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/ao/"&gt;
                      安哥拉
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/qa/"&gt;
                      卡塔尔
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/lk/"&gt;
                      斯里兰卡
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/pk/"&gt;
                      巴基斯坦
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/in/"&gt;
                      印度
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/pe/"&gt;
                      秘鲁
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/gr/"&gt;
                      希腊
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/ro"&gt;
                      罗马尼亚
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/ch"&gt;
                      瑞士
                     &lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/ie"&gt;
                      爱尔兰
                     &lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;div class="zz2"&gt; &lt;a class="bts2" href="javascript:void(0)"&gt;综合经营公司网站&lt;/a&gt;
&lt;div class="hover_menu hd"&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="http://www.bochk.com/web/home/home.xml?lang=cn"&gt;中国银行（香港）有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocigroup.com/pub/sc/"&gt;中银国际控股有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocichina.com/"&gt;中银国际证券股份有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bocgins.com/"&gt;中银集团保险有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocgi.com/"&gt;中银集团投资有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocgroup.com/bocg-life/sc/"&gt;中银集团人寿保险有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.bankofchina.com/bocins/"&gt;中银保险有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocaviation.com/"&gt;中银航空租赁有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocim.com/"&gt;中银基金管理有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.boccfc.cn/"&gt;中银消费金融有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="http://www.bocservices.com.cn/"&gt;中银金融商务有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://www.fintechboc.com/"&gt;中银金融科技有限公司&lt;/a&gt;&lt;/li&gt;
&lt;li class="last"&gt;&lt;a href="https://www.boc-leasing.com/"&gt;中银金融租赁有限公司&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!--com-box-end--&gt;
&lt;!--main-end--&gt;
&lt;!--2013-嵌-底部嵌套begin--&gt;
&lt;div class="footer_2013"&gt;
&lt;div class="footer_phone" style="height: 52px;"&gt;
&lt;p style="width: 865px;margin: 0 auto;background: none;text-align: center;"&gt;
&lt;em style="font-weight: bold;"&gt;&lt;a href="./aboutboc/BCP/202003/t20200302_18104670.html"&gt;客户投诉渠道及投诉处理流程&lt;/a&gt;&lt;/em&gt;
&lt;/p&gt;
&lt;p style="width: 865px;margin: 0 auto;"&gt;&lt;em&gt;客户服务与投诉热线：&lt;/em&gt;&lt;span&gt;95566&lt;/span&gt;(中国境内)；&lt;span&gt;+86(区号)95566&lt;/span&gt;(中国境外) &lt;em class="footer_sp"&gt;信用卡客服与投诉热线：&lt;/em&gt;&lt;span&gt;40066-95566&lt;/span&gt;(中国境内)； &lt;span&gt;+86-10-66085566&lt;/span&gt;(中国境外)&lt;/p&gt;
&lt;/div&gt;
&lt;div class="footer_copy" style="position: relative;height: 44px;"&gt;
&lt;div class="footer_area"&gt;
&lt;p&gt;
&lt;!--取提示信息栏目前四篇文档--&gt;
&lt;a href="./custserv/cs1/200812/t20081209_135605.html"&gt;
						网站地图
					&lt;/a&gt;&lt;i&gt;|&lt;/i&gt;
&lt;a href="./custserv/cs1/200812/t20081209_135606.html"&gt;
						版权声明
					&lt;/a&gt;&lt;i&gt;|&lt;/i&gt;
&lt;a href="./custserv/cs1/200812/t20081209_135607.html"&gt;
						使用条款
					&lt;/a&gt;&lt;i&gt;|&lt;/i&gt;
&lt;a href="./custserv/cs1/200812/t20081212_257687.html"&gt;
						联系我们
					&lt;/a&gt;&lt;i&gt;|&lt;/i&gt;
&lt;a href="https://beian.miit.gov.cn" target="_blank"&gt;京ICP备10052455号-1&lt;/a&gt; 京公网安备110102002036号 
            &lt;/p&gt;
&lt;p&gt;Copyright© BANK OF CHINA(BOC) All Rights Reserved. &lt;/p&gt;
&lt;/div&gt;
&lt;div style="position: absolute;right: 140px;top: 10px;"&gt;&lt;img alt="适老化无障碍服务认证标识" src="./images/LOGO-AGACCS.gif" style="display: block;"/&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;!--footer-end--&gt;
&lt;script&gt;
//控制导航选中
$(document).ready(function(){
	var curlocation = '中国银行';
	var array = curlocation.split(",");
	if(array.length &lt; 2)
		return false;
	var curchannelname = array[1];
	//逐个栏目进行分析，修改栏目样式
	$("#BOC_NAVIGATOR_UL li").each(function(){
		var curtext = $(this).find("a").eq(0).text();
		if(curchannelname == curtext){
			$("#BOC_NAVIGATOR_UL li").removeClass("current");
			$(this).addClass("current");
			return false;
		}
	});
});
&lt;/script&gt;
&lt;script type="text/javascript"&gt;
var pl_search_domain = "https://srh.bankofchina.com/search/";
/**
* @see 全站检索
* @param obj:对象
*/
function search_for_site(){
	//设置当前检索的 action
	$("#trssearchform").attr("action",pl_search_domain+"sitesearch/index.jsp");
	$("#trssearchform").submit();
}
&lt;/script&gt;
&lt;!--2013-嵌-底部嵌套end--&gt;
&lt;/div&gt;
&lt;!--wrapper--&gt;
&lt;script src="./images/boc2013_bxCarousel.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="./images/boc2013_share.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
 $(document).ready(function(){
	/*首页banner图切换*/
	(function(){
		var curr = 0;
		$(".banner_nav .trigger").each(function(i){
			$(this).click(function(){
				curr = i;
				$(".bn_img a").eq(i).fadeIn("slow").siblings("a").hide();
				$(this).siblings(".trigger").removeClass("imgSelected").end().addClass("imgSelected");
				return false;
			});
		});
		
		var pg = function(flag){
			//flag:true表示前翻， false表示后翻
			if (flag) {
				if (curr == 0) {

					todo = 2;
				} else {
					todo = (curr - 1) % 4;
				}
			} else {
				todo = (curr + 1) % 4;
			}
			$(".banner_nav .trigger").eq(todo).click();
		};
		//自动翻
		var timer = setInterval(function(){
			todo = (curr + 1) % 4;
			$(".banner_nav .trigger").eq(todo).click();
		},5000);
		
		//鼠标悬停在触发器上时停止自动翻
		$(".banner_nav span").hover(function(){
				clearInterval(timer);
			},
			function(){
				timer = setInterval(function(){
					todo = (curr + 1) % 4;
					$(".banner_nav .trigger").eq(todo).click();
				},5000);			
			}
		);
	})();

	//新加jq 切换  银行卡++++++++++++++++++++++
		$('#carousel2').elastislide({
    	imageW 	: 250,
    	minItems :1,
		margin : 0,	
		border : 0	
		});
		
		//分享
	var share_c = $('.share_pop').hide();
	var share_bt = $('.share');
	share_bt.click(function(){
		share_c.fadeToggle(400);
		return false;
	});
	$("body").click(function(){
		share_c.hide();
		})

	//全球服务
	var h_logbtn1 = $('.bts1');
	var h_menu1 = $('.zz1 .hover_menu').hide();
	h_logbtn1.click(function(){
		h_menu1.fadeToggle('fast');
		return false;
	})
	$("body").click(function(){
		h_menu1.hide();
		})
	
	var h_logbtn2 = $('.bts2');
	var h_menu2 = $('.zz2 .hover_menu').hide();
	h_logbtn2.click(function(){
		h_menu2.fadeToggle('fast');
		return false;
	})
	$("body").click(function(){
		h_menu2.hide();
		})
	
});
/*导航*/
var s_bMoveLeft = true;
var s_oTimer = null;
var s_oTimerOut = null;
var s_iSpeed = 3;
function MM_findObj(n, d) { 
	var p,i,x;
	if(!d) 
		d=document; 
	for(i=0;!x&amp;&amp;d.layers&amp;&amp;i&lt;d.layers.length;i++) 
		x=MM_findObj(n,d.layers[i].document);
	if(!x &amp;&amp; d.getElementById) 
		x=d.getElementById(n); 
		return x;
}

function showHideLayer() { 
	var i,p,v,obj,args=showHideLayer.arguments;
	for (i=0; i&lt;(args.length-2); i+=3) 
	if ((obj=MM_findObj(args[i]))!=null) 
	{
		v=args[i+2];
		if (obj.style) 
		{ 
			obj=obj.style;
			v=(v=='show')?'visible':(v=='hide')?'hidden':v; 
		}
    	obj.visibility=v; 
	}
}
//选项卡切换
function tabs(tabId, tabNum){
	$(tabId+' .tab_nav li').removeClass('selected');
	$(tabId+' .tab_nav li').eq(tabNum).addClass('selected');
	$(tabId+' .tab_content').hide();
	$(tabId+' .tab_content').eq(tabNum).show();
}


//2014touch事件====弹出菜单
var bo = document.getElementsByTagName("body")[0];
var isIE = (document.all &amp;&amp; window.ActiveXObject &amp;&amp; !window.opera) ? true : false;
function tch_event(name){
	function touchStart(event) {
    name.style.display="none"
	}
	if(isIE){
		bo.attachEvent("touchstart", touchStart, false);
		bo.attachEvent("touchmove", touchStart, false);
		bo.attachEvent("touchend", touchStart, false);
	}else{
		bo.addEventListener("touchstart", touchStart, false);
		bo.addEventListener("touchmove", touchStart, false);
		bo.addEventListener("touchend", touchStart, false);
	}
	

	function touchbb(event) {
    name.style.display="block"
	event.stopPropagation();
	}
	if(isIE){
		name.attachEvent("touchmove", touchbb, false);
		name.attachEvent("touchstart", touchbb, false);
		name.attachEvent("touchend", touchbb, false);
	}else{
		name.addEventListener("touchmove", touchbb, false);
		name.addEventListener("touchstart", touchbb, false);
		name.addEventListener("touchend", touchbb, false);
	}
}
//touch事件 end

//2014touch事件====导航菜单
function tch_eventM(name){
	
	function touchStart2(event) {
    name.style.visibility="hidden";
	}
	if(isIE){
		bo.attachEvent("touchstart", touchStart2, false);
		bo.attachEvent("touchmove", touchStart2, false);
		bo.attachEvent("touchend", touchStart2, false);
	}
	else{
		bo.addEventListener("touchstart", touchStart2, false);
		bo.addEventListener("touchmove", touchStart2, false);
		bo.addEventListener("touchend", touchStart2, false);
	}
	function touchbb2(event) {
    name.style.visibility="visible";
	event.stopPropagation();
	}
	if(isIE){
		name.attachEvent("touchmove", touchbb2, false);
		name.attachEvent("touchstart", touchbb2, false);
		name.attachEvent("touchend", touchbb2, false);
	}else{
		name.addEventListener("touchmove", touchbb2, false);
		name.addEventListener("touchstart", touchbb2, false);
		name.addEventListener("touchend", touchbb2, false);
	}
}

//touch事件 end
//2014获取元素
function getElementsByClassName(n){
	var classElements = [],allElements = document.getElementsByTagName('*');
	for(var i = 0;i&lt;allElements.length;i++){
		if(allElements[i].className == n){
			classElements[classElements.length]=allElements[i];	
		}	
	}
	return classElements;
}
if(typeof document.getElementsByClassName !='function'){  
         document.getElementsByClassName=getElementsByClassName;  
    }  
var className = document.getElementsByClassName('hd');
var subNav = document.getElementsByClassName('sub_menu');
for(var i = 0;i&lt;className.length;i++){
	tch_event(className[i]);	
}
for(var i =0;i&lt;subNav.length;i++){
	tch_eventM(subNav[i]);
}
&lt;/script&gt;
&lt;script&gt;
	//便捷服务切换
	$(function(){
		var LiW = $('#carousel .es-carousel ul li').width();
		$('#carousel .es-carousel ul').width(LiW*2);
		var btnNum = 0;
		$('#carousel .es-nav-next').click(function(){
			btnNum++;
			if(btnNum&gt;1){
				btnNum = 1;
				$('#carousel .es-carousel ul').animate({
					'left':-LiW*btnNum
				},500)
			}else {
				$('#carousel .es-carousel ul').animate({
					'left':-LiW*btnNum
				},500)
			}
		})
		$('#carousel .es-nav-prev').click(function(){
			btnNum--;
			if(btnNum&lt;0){
				btnNum = 0;
				$('#carousel .es-carousel ul').animate({
					'left':-LiW*btnNum
				},500)
			}else {
				$('#carousel .es-carousel ul').animate({
					'left':-LiW*btnNum
				},500)
			}
		})
	})
&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=08305a9b-3841-4a65-a700-65e0dadb3f4c">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [89]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="n">soup3</span><span class="o">=</span><span class="n">soup</span><span class="o">.</span><span class="n">select</span><span class="p">(</span><span class="s1">'li'</span><span class="p">)</span>
<span class="k">for</span> <span class="n">soup4</span> <span class="ow">in</span> <span class="n">soup3</span><span class="p">:</span>
    <span class="n">name1</span><span class="o">.</span><span class="n">append</span><span class="p">(</span><span class="n">soup4</span><span class="o">.</span><span class="n">text</span><span class="p">)</span>
<span class="nb">print</span><span class="p">(</span><span class="n">name1</span><span class="p">)</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>['首页', '公司金融', '个人金融', '银行卡', '金融市场', '电子银行', '投资者关系', '关于中行', '公司融资服务', '贸易金融服务', '公司金融市场服务', '人民币结算服务', '机构结构性存款', '账户与存款', '服务第三届消博会', '服务第五届进博会', '普惠金融', '养老金服务', '全球现金管理', '公告信息', '存款与账户', '个人贷款', '个人理财', '个人汇兑', '个人结构性存款', '个人交易', '出国金融', '惠民金融', '私人银行', '个人银行', '公告信息', '优惠活动', '信用卡产品', '借记卡产品', '服务指南', '优惠活动', '公告信息', '特色服务', '精彩海淘', '自营理财产品', '子公司理财产品', '托管理财产品', '代销理财产品', '托管基金产品', '柜台债券产品', '代销基金产品', '代理保险产品', '外汇市场分析', '债券市场分析', '黄金市场分析', '证券市场分析', '宏观经济研究', '中国银行人民币国际化指数', 'CFETS-BOC交易型债券指数', '境内外债券投融资比较指数', '个人网上银行', '企业网上银行', '手机银行', '电话银行', '服务资料', '安全防护', '优惠活动', '公告信息', '便捷服务', '登录中行网银', '公司战略及投资价值', '交易所公告（H股、A股）', '财务报告', '监管资本', '公司治理', '公司资料', '资本市场荣誉', '投资者服务', '可持续发展类债券', '关联交易公告', '中行动态', '媒体看中行', '中行荣誉', '企业社会责任', '中行概况', '中行机构', '中行历程', '消费者权益保护', '携手北京冬奥会', '招聘公告', '中行动态', '\n                  中国银行成立科技金融中心\n                  ', '\n                  中国银行与黑龙江省政府签署全面战略合作...\n                  ', '\n                  以金融之力支持做好发展新质生产力这篇大...\n                  ', '重要公告', '\n                  关于4月14日系统升级期间暂停投资理财相关...\n                  ', '\n                  关于开展小微企业支付手续费降费情况调查...\n                  ', '\n                  关于代理个人上金所业务调整白银延期合约...\n                  ', '服务价目公示', '\n                  中行电子银行转账汇款大优惠(2024年)\n                  ', '\n                  关于个人网银跨行人民币汇款手续费减免的...\n                  ', '\n                  2024年信用卡年费减免政策\n                  ', '\n\n\n\t\t                      手机银行客户端\n\t\t                      \n\n\n\n\t\t                      中银智采\n\t\t                      \n\n\n\n\t\t                      对公在线预约开户\n\t\t                      \n\n\n\n\t\t                      协议须知\n\t\t                      \n\n\n\n\t\t                      在线申请信用卡\n\t\t                      \n\n\n\n\t\t                      托管服务平台\n\t\t                      \n\n\n\n\t\t                      养老金服务\n\t\t                      \n\n\n\n\t\t                      回单验证\n\t\t                      \n\n\n\n\t\t                      业务验证\n\t\t                      \n\n\n\n\t\t                      “同e赢”平台\n\t\t                      \n\n', ' \n              中国银行海外分行外汇牌价\n               ', ' \n              中国银行远期外汇牌价\n               ', ' \n              存/贷款利率\n               ', ' \n              CFETS-BOC交易型债券指数\n               ', ' \n              代销基金净值\n               ', ' \n              券商产品净值\n               ', ' \n              自营理财产品净值\n               ', ' \n              子公司理财产品净值\n               ', ' \n              中国银行人民币国际化指数\n               ', ' \n              境内外债券投融资比较指数\n               ', ' \n              中国银行积极推动中美文化交流与民间交往\n               ', ' \n              新春走基层｜筑牢“防护网” 中国银行助力...\n               ', ' \n\t              中国银行可持续发展类债券2022年度报告\n\t               ', ' \n\t              中国银行转型债券2022年度报告\n\t               ', ' \n                中国银行股份有限公司关于二级资本债券发行...\n                 ', ' \n                中国银行股份有限公司关于副行长刘进先生任...\n                 ', ' \n                中国银行股份有限公司关于执行董事张毅先生...\n                 ', ' \n                公告-二级资本债券发行完毕\n                 ', ' \n                公告-本行副行长刘进先生之委任\n                 ', ' \n                董事名单与其角色和职能\n                 ', ' \n                公告-本行执行董事张毅先生之委任\n                 ', ' \n                中国银行股份有限公司关于非执行董事楼小惠...\n                 ', ' 消费者权益保护  ', ' 媒体看中行  ', ' \n                      书写“消保为民”新篇章 中国银行积极开...\n                       ', ' \n                      2024年“3•15”金融消费者权益保护教育...\n                       ', ' \n                      2024年“3•15”金融消费者权益保护教育...\n                       ', ' \n                      中国银行助力解决外籍来华人士支付堵点...\n                       ', ' \n                      中国银行高质量金融服务为经济发展添动...\n                       ', ' \n                      中国银行高质量服务江苏建设现代化产业...\n                       ', ' 招聘公告  ', ' 采购公告  ', ' \n                      中国银行股份有限公司2024年度拟接收境...\n                       ', ' \n                      中国银行股份有限公司2024年春季招聘公告\n                       ', ' \n                      中国银行股份有限公司2024年实习生招聘公告\n                       ', ' \n                      关于中银智采平台于2024年1月1日投入...\n                       ', ' \n                      中国银行股份有限公司2022年-2023年软...\n                       ', ' \n                      中国银行股份有限公司海外借记卡空白...\n                       ', '\n                      澳门地区\n                     \n', '\n                      台湾地区\n                     \n', '\n                      新加坡\n                     \n', '\n                      日本\n                     \n', '\n                      泰国\n                     \n', '\n                      越南\n                     \n', '\n                      马来西亚\n                     \n', '\n                      印度尼西亚\n                     \n', '\n                      柬埔寨\n                     \n', '\n                      俄罗斯\n                     \n', '\n                      英国\n                     \n', '\n                      法国\n                     \n', '\n                      卢森堡\n                     \n', '\n                      比利时\n                     \n', '\n                      荷兰\n                     \n', '\n                      波兰\n                     \n', '\n                      瑞典\n                     \n', '\n                      德国\n                     \n', '\n                      意大利\n                     \n', '\n                      匈牙利\n                     \n', '\n                      赞比亚\n                     \n', '\n                      美国\n                     \n', '\n                      加拿大\n                     \n', '\n                      巴拿马\n                     \n', '\n                      巴西\n                     \n', '\n                      新西兰\n                     \n', '\n                      澳大利亚\n                     \n', '\n                      韩国\n                     \n', '\n                      塞尔维亚\n                     \n', '\n                      毛里求斯\n                     \n', '\n                      土耳其\n                     \n', '\n                      墨西哥\n                     \n', '\n                      奥地利\n                     \n', '\n                      葡萄牙\n                     \n', '\n                      南非\n                     \n', '\n                      捷克\n                     \n', '\n                      智利\n                     \n', '\n                      老挝\n                     \n', '\n                      安哥拉\n                     \n', '\n                      卡塔尔\n                     \n', '\n                      斯里兰卡\n                     \n', '\n                      巴基斯坦\n                     \n', '\n                      印度\n                     \n', '\n                      秘鲁\n                     \n', '\n                      希腊\n                     \n', '\n                      罗马尼亚\n                     \n', '\n                      瑞士\n                     \n', '\n                      爱尔兰\n                     \n', '中国银行（香港）有限公司', '中银国际控股有限公司', '中银国际证券股份有限公司', '中银集团保险有限公司', '中银集团投资有限公司', '中银集团人寿保险有限公司', '中银保险有限公司', '中银航空租赁有限公司', '中银基金管理有限公司', '中银消费金融有限公司', '中银金融商务有限公司', '中银金融科技有限公司', '中银金融租赁有限公司']
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell" id="cell-id=8a6c4ac4-c0de-4b3e-9134-3df15d70de19">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [90]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span><span class="n">za</span><span class="o">=</span><span class="n">pd</span><span class="o">.</span><span class="n">DataFrame</span><span class="p">({</span><span class="s1">'title'</span><span class="p">:</span><span class="n">name1</span><span class="p">})</span>
<span class="nb">print</span><span class="p">(</span><span class="n">name1</span><span class="p">)</span>
<span class="n">writer</span> <span class="o">=</span> <span class="n">pd</span><span class="o">.</span><span class="n">ExcelWriter</span><span class="p">(</span><span class="s1">'once.xlsx'</span><span class="p">)</span>
<span class="n">za</span><span class="o">.</span><span class="n">to_excel</span><span class="p">(</span><span class="n">writer</span><span class="p">,</span><span class="n">sheet_name</span><span class="o">=</span><span class="s1">'tb3'</span><span class="p">,</span> <span class="n">index</span><span class="o">=</span><span class="kc">False</span><span class="p">)</span>
<span class="n">writer</span><span class="o">.</span><span class="n">_save</span><span class="p">()</span>
</pre></div>
</div>
</div>
</div>
</div>
<div class="jp-Cell-outputWrapper">
<div class="jp-Collapser jp-OutputCollapser jp-Cell-outputCollapser">
</div>
<div class="jp-OutputArea jp-Cell-outputArea">
<div class="jp-OutputArea-child">
<div class="jp-OutputPrompt jp-OutputArea-prompt"></div>
<div class="jp-RenderedText jp-OutputArea-output" data-mime-type="text/plain" tabindex="0">
<pre>['首页', '公司金融', '个人金融', '银行卡', '金融市场', '电子银行', '投资者关系', '关于中行', '公司融资服务', '贸易金融服务', '公司金融市场服务', '人民币结算服务', '机构结构性存款', '账户与存款', '服务第三届消博会', '服务第五届进博会', '普惠金融', '养老金服务', '全球现金管理', '公告信息', '存款与账户', '个人贷款', '个人理财', '个人汇兑', '个人结构性存款', '个人交易', '出国金融', '惠民金融', '私人银行', '个人银行', '公告信息', '优惠活动', '信用卡产品', '借记卡产品', '服务指南', '优惠活动', '公告信息', '特色服务', '精彩海淘', '自营理财产品', '子公司理财产品', '托管理财产品', '代销理财产品', '托管基金产品', '柜台债券产品', '代销基金产品', '代理保险产品', '外汇市场分析', '债券市场分析', '黄金市场分析', '证券市场分析', '宏观经济研究', '中国银行人民币国际化指数', 'CFETS-BOC交易型债券指数', '境内外债券投融资比较指数', '个人网上银行', '企业网上银行', '手机银行', '电话银行', '服务资料', '安全防护', '优惠活动', '公告信息', '便捷服务', '登录中行网银', '公司战略及投资价值', '交易所公告（H股、A股）', '财务报告', '监管资本', '公司治理', '公司资料', '资本市场荣誉', '投资者服务', '可持续发展类债券', '关联交易公告', '中行动态', '媒体看中行', '中行荣誉', '企业社会责任', '中行概况', '中行机构', '中行历程', '消费者权益保护', '携手北京冬奥会', '招聘公告', '中行动态', '\n                  中国银行成立科技金融中心\n                  ', '\n                  中国银行与黑龙江省政府签署全面战略合作...\n                  ', '\n                  以金融之力支持做好发展新质生产力这篇大...\n                  ', '重要公告', '\n                  关于4月14日系统升级期间暂停投资理财相关...\n                  ', '\n                  关于开展小微企业支付手续费降费情况调查...\n                  ', '\n                  关于代理个人上金所业务调整白银延期合约...\n                  ', '服务价目公示', '\n                  中行电子银行转账汇款大优惠(2024年)\n                  ', '\n                  关于个人网银跨行人民币汇款手续费减免的...\n                  ', '\n                  2024年信用卡年费减免政策\n                  ', '\n\n\n\t\t                      手机银行客户端\n\t\t                      \n\n\n\n\t\t                      中银智采\n\t\t                      \n\n\n\n\t\t                      对公在线预约开户\n\t\t                      \n\n\n\n\t\t                      协议须知\n\t\t                      \n\n\n\n\t\t                      在线申请信用卡\n\t\t                      \n\n\n\n\t\t                      托管服务平台\n\t\t                      \n\n\n\n\t\t                      养老金服务\n\t\t                      \n\n\n\n\t\t                      回单验证\n\t\t                      \n\n\n\n\t\t                      业务验证\n\t\t                      \n\n\n\n\t\t                      “同e赢”平台\n\t\t                      \n\n', ' \n              中国银行海外分行外汇牌价\n               ', ' \n              中国银行远期外汇牌价\n               ', ' \n              存/贷款利率\n               ', ' \n              CFETS-BOC交易型债券指数\n               ', ' \n              代销基金净值\n               ', ' \n              券商产品净值\n               ', ' \n              自营理财产品净值\n               ', ' \n              子公司理财产品净值\n               ', ' \n              中国银行人民币国际化指数\n               ', ' \n              境内外债券投融资比较指数\n               ', ' \n              中国银行积极推动中美文化交流与民间交往\n               ', ' \n              新春走基层｜筑牢“防护网” 中国银行助力...\n               ', ' \n\t              中国银行可持续发展类债券2022年度报告\n\t               ', ' \n\t              中国银行转型债券2022年度报告\n\t               ', ' \n                中国银行股份有限公司关于二级资本债券发行...\n                 ', ' \n                中国银行股份有限公司关于副行长刘进先生任...\n                 ', ' \n                中国银行股份有限公司关于执行董事张毅先生...\n                 ', ' \n                公告-二级资本债券发行完毕\n                 ', ' \n                公告-本行副行长刘进先生之委任\n                 ', ' \n                董事名单与其角色和职能\n                 ', ' \n                公告-本行执行董事张毅先生之委任\n                 ', ' \n                中国银行股份有限公司关于非执行董事楼小惠...\n                 ', ' 消费者权益保护  ', ' 媒体看中行  ', ' \n                      书写“消保为民”新篇章 中国银行积极开...\n                       ', ' \n                      2024年“3•15”金融消费者权益保护教育...\n                       ', ' \n                      2024年“3•15”金融消费者权益保护教育...\n                       ', ' \n                      中国银行助力解决外籍来华人士支付堵点...\n                       ', ' \n                      中国银行高质量金融服务为经济发展添动...\n                       ', ' \n                      中国银行高质量服务江苏建设现代化产业...\n                       ', ' 招聘公告  ', ' 采购公告  ', ' \n                      中国银行股份有限公司2024年度拟接收境...\n                       ', ' \n                      中国银行股份有限公司2024年春季招聘公告\n                       ', ' \n                      中国银行股份有限公司2024年实习生招聘公告\n                       ', ' \n                      关于中银智采平台于2024年1月1日投入...\n                       ', ' \n                      中国银行股份有限公司2022年-2023年软...\n                       ', ' \n                      中国银行股份有限公司海外借记卡空白...\n                       ', '\n                      澳门地区\n                     \n', '\n                      台湾地区\n                     \n', '\n                      新加坡\n                     \n', '\n                      日本\n                     \n', '\n                      泰国\n                     \n', '\n                      越南\n                     \n', '\n                      马来西亚\n                     \n', '\n                      印度尼西亚\n                     \n', '\n                      柬埔寨\n                     \n', '\n                      俄罗斯\n                     \n', '\n                      英国\n                     \n', '\n                      法国\n                     \n', '\n                      卢森堡\n                     \n', '\n                      比利时\n                     \n', '\n                      荷兰\n                     \n', '\n                      波兰\n                     \n', '\n                      瑞典\n                     \n', '\n                      德国\n                     \n', '\n                      意大利\n                     \n', '\n                      匈牙利\n                     \n', '\n                      赞比亚\n                     \n', '\n                      美国\n                     \n', '\n                      加拿大\n                     \n', '\n                      巴拿马\n                     \n', '\n                      巴西\n                     \n', '\n                      新西兰\n                     \n', '\n                      澳大利亚\n                     \n', '\n                      韩国\n                     \n', '\n                      塞尔维亚\n                     \n', '\n                      毛里求斯\n                     \n', '\n                      土耳其\n                     \n', '\n                      墨西哥\n                     \n', '\n                      奥地利\n                     \n', '\n                      葡萄牙\n                     \n', '\n                      南非\n                     \n', '\n                      捷克\n                     \n', '\n                      智利\n                     \n', '\n                      老挝\n                     \n', '\n                      安哥拉\n                     \n', '\n                      卡塔尔\n                     \n', '\n                      斯里兰卡\n                     \n', '\n                      巴基斯坦\n                     \n', '\n                      印度\n                     \n', '\n                      秘鲁\n                     \n', '\n                      希腊\n                     \n', '\n                      罗马尼亚\n                     \n', '\n                      瑞士\n                     \n', '\n                      爱尔兰\n                     \n', '中国银行（香港）有限公司', '中银国际控股有限公司', '中银国际证券股份有限公司', '中银集团保险有限公司', '中银集团投资有限公司', '中银集团人寿保险有限公司', '中银保险有限公司', '中银航空租赁有限公司', '中银基金管理有限公司', '中银消费金融有限公司', '中银金融商务有限公司', '中银金融科技有限公司', '中银金融租赁有限公司']
</pre>
</div>
</div>
</div>
</div>
</div><div class="jp-Cell jp-CodeCell jp-Notebook-cell jp-mod-noOutputs" id="cell-id=58a75c52-60f4-401d-946f-585b9b1d3f5f">
<div class="jp-Cell-inputWrapper" tabindex="0">
<div class="jp-Collapser jp-InputCollapser jp-Cell-inputCollapser">
</div>
<div class="jp-InputArea jp-Cell-inputArea">
<div class="jp-InputPrompt jp-InputArea-prompt">In [ ]:</div>
<div class="jp-CodeMirrorEditor jp-Editor jp-InputArea-editor" data-type="inline">
<div class="cm-editor cm-s-jupyter">
<div class="highlight hl-ipython3"><pre><span></span> 
</pre></div>
</div>
</div>
</div>
</div>
</div>
</main>
</body>
</html>
